对于Web标准以及W3C的理解、对viewport的理解、xhtml和html有什么区别?

1、对于Web标准以及W3C的理解

Web标准

Web标准简单来说可以分为结构、表现、行为。

其中结构是由HTML各种标签组成,简单来说就是body里面写入标签是为了页面的结构。

表现指的是CSS层叠样式表,通过CSS可以让我们的页面结构标签更具美感。

行为指的是页面和用户具有一定的交互,这部分主要由JS组成。标签闭合 、标签小写 、不乱嵌套 、使用外链 css 和 js 、结构行为表现的分离。

W3C

W3C,全称:world wide web consortium是一个制定各种标准的非盈利性组织,也叫万维网联盟,标准包括HTML、CSS、ECMAScript等等,web标准的制定有很多好处,比如说:

  • 可以统一开发流程,统一使用标准化开发工具(VSCode、WebStorm、Sublime),方便多人协作
  • 学习成本降低,只需要学习标准就行,否则就要学习各个浏览器厂商标准
  • 跨平台,方便迁移都不同设备
  • 降低代码维护成本

2、对viewport的理解

viewport的概念

通俗的讲,就是浏览器上(也可能是一个app中的webview)用来显示网页的那部分区域,但viewport又不局限于浏览器可视区域的大小,它可能比浏览器的可视区域要大,也可能比浏览器的可视区域要小。

在默认情况下,一般来讲,移动设备上的viewport都是要大于浏览器可视区域的,这是因为考虑到移动设备的分辨率相对于桌面电脑来说都比较小,所以为了能在移动设备上正常显示那些传统的为桌面浏览器设计的网站,移动设备上的浏览器都会把自己默认的viewport设为980px或1024px(也可能是其它值,这个是由设备自己决定的),但带来的后果就是浏览器会出现横向滚动条,因为浏览器可视区域的宽度是比这个默认的viewport的宽度要小的。下图列出了一些设备上浏览器的默认viewport的宽度。
在这里插入图片描述

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimu // width 设置viewport宽度,为一个正整数,或字符串‘device-width’
// device-width 设备宽度
// height 设置viewport高度,一 般设置了宽度,会自动解析出高度,可以不用设置               
// initial-scale  默认缩放比例 (初始缩放比例), 为一个数字,可以带小数
// minimum-scale  允许用户最小缩放比例,为一个数字,可以带小数
// maximum-scale  允许用户最大缩放比例,为一个数字,可以带小数
// user-scalable  是否允许手动缩放

怎样处理 移动端1px 被 渲染成 2px 问题

局部处理

mate 标签中的 viewport 属性 , initial-scale 设置为 1
rem 按照设计稿标准走,外加利用 transfrome 的 scale(0.5) 缩小一倍即可;

全局处理

mate 标签中的 viewport 属性 , initial-scale 设置为 0.5
rem 按照设计稿标准走即可

3、xhtml和html有什么区别?

XHTML(可扩展超文本标记语言)是HTML(超文本标记语言)的一种变体,它比HTML更严格,更注重文档结构的准确性和规范性。

以下是XHTML和HTML之间的一些主要区别:

  1. 语法: XHTML比HTML更严格,必须正确地编写标记和使用小写标签,属性和属性值必须加引号。

  2. 文档结构: XHTML要求文档要求结构清晰,文档必须包含根元素,必须具有正确的文档类型定义。

  3. 元素和属性: XHTML比HTML更严格,某些元素和属性在HTML中是允许省略的,但在XHTML中是禁止的。例如,XHTML中必须包含alt属性在img元素中,元素必须被正确地嵌套,闭合, 区分大小写。

  4. 功能:XHTML 可兼容各大浏览器 、手机以及 PDA , 并且浏览器也能快速正确地编译网 ⻚

总之,XHTML是HTML的一种严格版本,它强制要求更准确的标记结构和语法,同时为网络内容提供可访问性、可维护性和可扩展性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/188522.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于 ls -s 输出文件大小的单位问题的讨论

自己看书正好看到这里&#xff0c;正纳闷呢&#xff0c;上网查了下&#xff0c;发现不是我自己在为这个问题感到困惑。 有个大哥提出一个问题&#xff1a; 问题标题&#xff1a; ls -s的单位到底是什么&#xff1f; man ls -s, --size print the alloca…

[读论文][跑代码]BK-SDM: A Lightweight, Fast, and Cheap Version of Stable Diffusion

github: GitHub - Nota-NetsPresso/BK-SDM: A Compressed Stable Diffusion for Efficient Text-to-Image Generation [ICCV23 Demo] [ICML23 Workshop] ICML 2023 Workshop on ES-FoMo 简化方式 蒸馏方式&#xff08;训练Task蒸馏outKD-FeatKD&#xff09; 训练数据集 评测指标…

美丽的时钟

案例绘制一个时钟 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>美丽的时钟</title><script language"javascript">window.onloadfunction(){var clockdocument.getElementById("clock"…

Unity 使用Horizontal Layout Group和Toggle制作多个水平开关按钮实现自动排列和单个点击放大后的自动排列。

Unity的布局组件Horizontal Layout Group是很好用的&#xff0c;当然也包括其它布局组件也一样好用。 比如要实现多按钮开关自动水平排列&#xff0c;那么就可以使用它了。 首先我们为按钮创建个父物体&#xff08;我这里使用了Scroll View中的Content作为父物体&#xff09;…

weblogic任意文件上传漏洞(CVE-2018-2894)

任务一&#xff1a; 复现环境中的漏洞 任务二&#xff1a; 上传webshell或者反弹shell&#xff0c;并执行whoami。 任务一&#xff1a; 1.环境搭建&#xff0c;发现需要密码&#xff0c;所以我们去日志里面查看管理员密码。 2.了解一下这个平台&#xff0c;然后进行一些基本配…

基于Python Flask 的全流程全栈项目自己的实战心得

我基于Python Flask框架开发全流程全栈项目的实战经验和心得。我将介绍整个项目的架构设计、前后端交互、数据库管理以及部署等方面&#xff0c;并提供具体的代码示例。通过这个实例项目&#xff0c;你将学习到如何使用Flask构建一个完整的Web应用&#xff0c;并了解一些常见的…

实现优雅的自增枚举类:Python中的枚举与自增技巧

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 枚举类型在编程中扮演着重要的角色&#xff0c;它们为变量赋予了更加清晰的含义。然而&#xff0c;在Python中&#xff0c;实现自增的枚举类并非直接而简单的任务。本文将深入讨论如何通过不同的方式优雅地实现自…

Zigbee—基于Z-STACK组网

&#x1f3ac;慕斯主页&#xff1a;修仙—别有洞天 ♈️今日夜电波&#xff1a;チノカテ—ヨルシカ 0:46━━━━━━️&#x1f49f;──────── 4:08 &#x1f504; ◀️ ⏸ ▶️ ☰ &a…

每天五分钟计算机视觉:经典的卷积神经网络之VGG-16模型

VGG-16 Vgg16是牛津大学VGG组提出来的,相比于AlexNet来说,AlexNet的一个改进是采用连续的几个4*3的卷积核来代替AlexNet中的较大的卷积核(11*11,5*5)。前面我们也说过了使用小卷积核是优于大的卷积核的,因为多层非线性层可以增加网络深度来保证学习到更加复杂的模式,而且代…

TTM Squeeze挤牌指标选股公式,通过波动率和动量判断能量释放

TTM Squeeze&#xff08;挤牌&#xff09;是由约翰卡特(John Carter)发明的波动率和动量指标&#xff0c;在其著作《驾驭交易》中进行了介绍。当价格在窄幅区间震荡盘整为下一次大幅上涨或下跌积蓄能量时&#xff0c;就可以用挤牌指标来识别。Squeeze的意思是“挤压”&#xff…

速通MySql

一、简介 1、什么是数据库 数据仓库&#xff0c;用来存储数据。访问必须用SQL语句来访问 2、数据库的类型 1、关系型数据库&#xff1a;Oracle、DB2、Microsoft SQL Server、Microsoft Access、MySQL等 可以用SQL语句方便的在一个表以及多个表之间做非常复杂的数据查询&#…

模糊C均值(Fuzzy C-means,FCM)聚类的python程序代码的逐行解释,看完你也会写!!

文章目录 前言一、本文的原始代码二、代码的逐行详细解释总结 前言 接上一篇博客&#xff0c;详细解释FCM聚类的程序代码&#xff01;&#xff01; 一、本文的原始代码 import numpy as np import matplotlib.pyplot as plt from sklearn import datasets import skfuzzy as…

Open3D 最小二乘拟合二维直线(直接求解法)

目录 一、算法原理二、代码实现三、结果展示本文由CSDN点云侠原创,原文链接。爬虫网站自重。 一、算法原理 平面直线的表达式为: y = k x + b

【软件推荐】卸载360软件geek;护眼软件flux;

卸载360软件geek f.lux: software to make your life better (justgetflux.com) 卸载完扫描残留 护眼软件 hf.lux: software to make your life better (justgetflux.com)https://justgetflux.com/https://justgetflux.com/

【Java8系列06】Java8数据计算

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

应用于智慧工地的AI边缘计算盒子+AI算法软硬一体化方案

智慧工地解决方案&#xff0c;围绕施工工地最常见的工人工服识别、安全帽佩戴识别、人脸识别、安全周界检测、打电话/吸烟、摔倒检测、明火检测、渣土车、土堆裸露识别等一系列子场景专门推出的通用解决方案&#xff0c;着眼工地安全施工、规范人员进出、保护设备安全等刚性需求…

vscode插件问题

1 Vscode code颜色变化 最外层标签颜色变成白色 其他标签有颜色&#xff0c;css代码颜色有些变成白色 是安装的另一个插件vue影响的&#xff0c;卸载就能恢复正常的颜色 2 配置Vue项目的代码片段 css 样式代码片段 配置css.json上后偶尔能用偶尔不能用&#xff0c;Vscode 右下…

Windows核心编程 远程线程注入

目录 线程安全 C线程 C STL线程 远程线程注入概述 相关API CreateRemoteThread LoadLibrary VirtualAllocEx FreeLibrary GetProcAddress 远程线程注入 DLL卸载 调试DLL 线程安全 变量在单线程和在多线程都不会出问题 - 线程安全 变量在多线程出问题&#xff0c…

CCC数字车钥匙(八)——BLE配对相关字段

2.1 配对连接协议 2.1.3 所有者配对广播 对于所有者配对&#xff0c;仅支持Legacy LE 1M PHY。ADV_IND需要按照Section 2.3.1.1 Volume 6 Part B。 事件类型&#xff1a;无指向可连接和可扫描。 ADV_IND中包含广播地址和广播数据&#xff0c;如下所示&#xff0c;其中广播地址…

TZOJ 1402 Bitset

答案&#xff1a; #include <stdio.h> int main() {int n 0, j 0; while (scanf("%d", &n) ! EOF && (n>0 && n<1000)) //多组输入{int arr[32], i 0;while (n > 0) {arr[i] n % 2; //除2取余法n / 2;}for (j i -…