对于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.mfbz.cn/a/207917.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2023年12月02日新闻简报(国内国际)

新闻简报 每天三分钟&#xff0c;朝闻天下事。今天是&#xff1a;2023年12月02日&#xff0c;星期六&#xff0c;农历十月廿十&#xff0c;祝工作愉快&#xff0c;身体健康&#xff0c;生活喜乐&#xff1a;&#xff1a; 国内新闻 1、商务部&#xff1a;对原产于澳大利亚的进…

【C指针】深入理解指针(最终篇)数组指针指针运算题解析(一)

&#x1f308;write in front :&#x1f50d;个人主页 &#xff1a; 啊森要自信的主页 ✏️真正相信奇迹的家伙&#xff0c;本身和奇迹一样了不起啊&#xff01; 欢迎大家关注&#x1f50d;点赞&#x1f44d;收藏⭐️留言&#x1f4dd;>希望看完我的文章对你有小小的帮助&am…

电商营销场景的RocketMQ实战01-RocketMQ原理

架构图 Broker主从架构与集群模式 RocketMQ原理深入剖析 Broker主从架构原理 HAConnection与HAClient Broker基于raft协议的主从架构 Consumer运行原理 基础知识 001_RocketMQ架构设计与运行流程分析 RocketMQ这一块&#xff0c;非常关键的一个重要的技术&#xff0c;面试的时候…

【Vue3+Ts项目】硅谷甄选 — 搭建后台管理系统模板

一、 项目初始化 一个项目要有统一的规范&#xff0c;需要使用eslintstylelintprettier来对我们的代码质量做检测和修复&#xff0c;需要使用husky来做commit拦截&#xff0c;需要使用commitlint来统一提交规范&#xff08;即统一提交信息&#xff09;&#xff0c;需要使用pre…

Day04:每日一题:2661. 找出叠涂元素

2661. 找出叠涂元素 给你一个下标从 0 开始的整数数组 arr 和一个 m x n 的整数 矩阵 mat 。 arr 和 mat 都包含范围 [1&#xff0c;m * n] 内的 所有 整数。从下标 0 开始遍历 arr 中的每个下标 i &#xff0c;并将包含整数 arr[i] 的 mat 单元格涂色。请你找出 arr 中在 mat…

ubuntu系统下搭建本地物联网mqtt服务器的步骤

那么假如我们需要做一些终端设备&#xff0c;例如温湿度传感器、光照等物联网采集设备要接入呢&#xff1f;怎么样才能将数据报送到服务器呢&#xff1f; 以下内容基于我们ubuntu系统下的emqx成功启动的基础上。我们可以用浏览器键入控制板的地址&#xff0c;如果启动成功&…

【数电笔记】基本和复合逻辑运算

说明&#xff1a; 笔记配套视频来源&#xff1a;B站 基本逻辑运算 1. 与运算 &#xff08;and gate&#xff09; 2. 或运算 &#xff08;or gate&#xff09; 3. 非运算 &#xff08;not gate &#xff09; 复合逻辑运算 1. 与非运算&#xff08;nand&#xff09; 2. 或非运…

机器人仿真系统调研

仿真是机器人学习和研究过程中最重要的工具之一&#xff0c;是指通过计算机对实际的物理系统进行模拟的技术。机器人仿真基于交互式计算机图形技术和机器人学理论&#xff0c;生成机器人的几何图形&#xff0c;并对其进行三维显示&#xff0c;用来描述机器人及工作环境的动态变…

九章量子计算机:探索量子世界的革命性工具

九章量子计算机:探索量子世界的革命性工具 一、引言 九章量子计算机的推出,是近年来科技界最为引人瞩目的成就之一。这款基于量子力学的计算机,以其独特的计算方式和潜在的应用前景,引发了全球范围内的关注和讨论。本文将深入探讨九章量子计算机的原理、技术特点、应用前景…

计算机硬件(二)

1.内存和内存条的用途 假设运行内存16个g,能开多少软件 后台和前台能同时运行多少APP RAM越大越好 464 6128 8128 10256 例子: 8gx216g 两根内存条 16g运行内存 2.内存频率的用途 DDR5 DDR4 DDR3 后面的数字越大,越好,可以理解为传输的速度&#xff0c;内存搭配主…

小米智能摄像头mp4多碎片手工恢复案例

小米智能摄像头mp4多碎片手工恢复案例 智能摄像头目前在市场上极为常见&#xff0c;仅需要一张存储卡即可实现视频、音频的采集&#xff0c;同时可以通过手机APP进行远程控制&#xff0c;相比传统安防品牌成本更低、更容易部署。在智能摄像头品牌中小米算是绝对的大厂&#xf…

ES-深入理解倒排索引

倒排索引 idproductdesc1新版 小米 至尊-纪念版手机1小米 NFC 手机3NFC手机4小米 耳机5华为 耳机6扫地机器人7华为 Mata………………term_indexterm dictionaryposting list------------------------------------小米1……100W华为6,7,9NFC76,90耳机5352红米643,98机器人645,9…

数字电源为什么一般用DSP控制,而不能用普通的单片机?

数字电源为什么一般用DSP控制&#xff0c;而不能用普通的单片机&#xff1f; 首先你要清楚&#xff0c;数字电源需要一个芯片具备什么功能&#xff1f; 1 能发PWM波 &#xff0c;并且具备保护关断功能&#xff1b; 电源对PWM发波 要求很高&#xff0c;精度要ns级甚至ps级的&…

C++中异常的栈展开概念

C中的异常栈展开是指&#xff0c;当某个函数中有异常产生&#xff08;这里不考虑是主动抛出的还是被动产生的&#xff09;&#xff0c;在异常被捕获之前的函数调用链上&#xff0c;函数不会正常执行返回&#xff0c;即异常产生之后的程序逻辑不会被执行。 &#xff08;注意&…

RTDETR阅读笔记

RTDETR阅读笔记 摘要 DETR的高计算成本限制了它们的实际应用&#xff0c;并阻碍了它们充分利用无需后处理&#xff08;例如非最大抑制NMS&#xff09;的优势。文中首先分析了NMS对实施目标检测的精度和速度的负面影响。&#xff08;RTDETR是第一个实时端到端的目标检测器。具…

temu货不对板哪里修改图片

在Temu这个跨境电商平台上&#xff0c;如果您需要修改商品图片&#xff0c;通常需要在卖家中心进行操作。下面是一般的步骤&#xff0c;但请注意&#xff0c;不同平台的操作可能略有不同&#xff0c;具体请参考Temu官方的帮助文档或联系客服。 先给大家推荐一款拼多多/temu运营…

OpenCV快速入门:彩蛋——小游戏制作

文章目录 前言一、游戏玩法1.1 核心玩法1.2 特殊事件 二、功能模块划分2.1 主游戏文件 (main.py)2.2 游戏对象 (game_objects.py)2.3 游戏逻辑 (game_logic.py)2.4 事件和奖励 (events_and_rewards.py)2.5. 游戏界面 (game_ui.py) 三、完整代码3.1 主游戏文件 (main.py)3.1.1 游…

计算机网络(超详解!) 第二节 物理层(下)

1.信道复用技术 复用 (multiplexing) 是通信技术中的基本概念。 它允许用户使用一个共享信道进行通信&#xff0c;降低成本&#xff0c;提高利用率。 1.频分复用 FDM(Frequency Division Multiplexing) 将整个带宽分为多份&#xff0c;用户在分配到一定的频带后&#xff0c;…

20、LED点阵屏

LED点阵屏介绍 LED点阵屏由若干个独立的LED组成&#xff0c;LED以矩阵的形式排列&#xff0c;以灯珠亮灭来显示文字、图片、视频等。LED点阵屏广泛应用于各种公共场合&#xff0c;如汽车报站器、广告屏以及公告牌等 LED点阵屏分类 按颜色&#xff1a;单色、双色、全彩 按像素…

企业营销管理能够实现自动化吗?怎么做?

当今企业面临着越来越多的营销难题&#xff1a;如何有效培育潜在客户、如何提高营销活动的效果、如何优化营销资源的分配......企业的营销管理怎么做&#xff1f;或许CRM系统营销自动化会起到作用。 客户细分&#xff1a; 企业可以通过CRM的客户细分功能&#xff0c;根据客户…