<!DOCTYPE html>的作用是什么
一、背景
从今天开始会不定时的发布一些前端的常见面试题,供大家参考。今天要发布的内容是关于html的面试题的作用是什么。接下来就一起讨论以下吧
二、概念
DOCTYPE 是html5中一种标准通用标记语言的文档类型的声明,它的目的就是为了告诉浏览器应该以什么样的文档类型定义来解析文档。不是一个html标签,二是一个指令,负责告诉浏览器页面使用哪个html版本来编写。
三、主要作用
1、启用浏览器的标准模式或者怪异模式
2、用来告诉浏览器应该使用哪种HTML版本来解析文档。这声明对于确保在不同浏览器中的正确显示和行为具有至关重要的作用。DOCTYPE 声明位于HTML 档的最顶部,是文档的第一行。
1)CSS1Compat(标准模式):浏览器按照 W3C的标准严格解析代码,的显示效果和性能表现更加符合现代web标准。例如:语雀官网的文档类型就是 CSS1Compat
2)BackCompat(怪异模式):假如文档缺少DOCTYPE 或使错误的 DOCTYPE ,浏览器就可能采这种模式,可能不会按照开发者的预期渲染。
不同的渲染模式会影响浏览器对 CSS 代码甚⾄JavaScript 脚本的解析。
正确的 DOCTYPE 声明是现代 web 开发的基础,有助于:
- 提高页面的兼容性,确保在不同的浏览器和设备上都能正常显示。
- 减少调试和维护的时间,避免因浏览器解析差异导致的多数常见问题。
四、深挖
首先我们来看一下这个声明的由来,mdn描述:
在很久以前的网络上,页面通常有两种版本:为网景(Netscape)的 Navigator 准备的版本,以及为微软(Microsoft)的 Internet Explorer 准备的版本。当 W3C 创立网络标准后,为了不破坏当时既有的网站,浏览器不能直接弃用这些标准。因此,浏览器采用了两种模式,用以把能符合新规范的网站和老旧网站区分开。
目前浏览器的排版引擎使用三种模式:怪异模式(Quirks mode)、接近标准模式(Almost standards mode)、以及标准模式(Standards mode)。
那么浏览器是如何去选择使用哪种模式的呢?
对 HTML 文件来说,浏览器使用文件开头的 DOCTYPE 来决定用怪异模式处理或标准模式处理。
然而目前 唯一的作用是启用标准模式。
五、总结
综上我们可以总结一下哈,那就是主要的作用就是通过声明的方式告知浏览器应该选用哪种模式进行解析html,css等代码,目前浏览器的排版引擎使用三种模式:怪异模式、接近标准模式、以及标准模式。如果不声明的话,浏览器就会默认使用怪异模式来解析,这可能和开发者的预期不符。所以,正确的 DOCTYPE 声明是现代 web 开发的基础,这有助于提高页面的兼容性,确保在不同的浏览器和设备上都能正常显示,也能减少调试和维护的时间。
六、结语
今天的面试题就分享到这里,今后还会有其他关于前端面试的面试题,想要快速找到这个专栏,可以进入我的社区,社区中的面试题专栏,会持续更新面试题,感谢大家的耐心阅读,希望这篇文章能给您带来一些启发和帮助。如果您有任何疑问或建议,请随时在评论区留言,我会尽快回复。如果您觉得这篇文章还不错,请点赞、分享给更多的朋友吧!同时,也欢迎关注我的博客,获取更多精彩内容。
相关文章:
<!DOCTYPE html>的作用是什么
一、背景 从今天开始会不定时的发布一些前端的常见面试题,供大家参考。今天要发布的内容是关于html的面试题的作用是什么。接下来就一起讨论以下吧 二、概念 DOCTYPE 是html5中一种标准通用标记语言的文档类型的声明,它的目的就是为了告诉浏览器应该以…...
EasyExcel改名为FastExce做了那些改变呢
回到:github原作者地址:https://github.com/CodePhiliaX/fastexcel 中文 |English | 什么是 FastExcel FastExcel 是由原 EasyExcel 作者创建的新项目。2023 年我已从阿里离职,近期阿里宣布停止更新 EasyExcel,作者他本人决定继…...
狗狗的生育周期:关注与呵护
狗狗的繁殖是一个复杂且需要谨慎对待的过程,了解其生产周期对于宠物主人以及从事相关行业的人员至关重要。 一般而言,狗狗的怀孕周期约为两个月左右,但这并非绝对固定。从受孕到分娩,通常在 58 至 65 天之间波动。小型犬可能相对…...
ABAP DIALOG屏幕编程2
在上一篇博客ABAP DIALOG屏幕编程1中阐述了DIALOG、PBO、PAI的概念并且对常用页面元素怎么用进行了演示。在这一篇博文中会讲述怎么添加下拉框、搜索帮助,怎么创建表控件、屏幕跳转等。会用到上一篇里面的内容。 有关程序包含文件结构如下。 一、响应用户指令 如上…...
获取缓存大小与清除 Web 缓存 - 鸿蒙 HarmonyOS Next
针对浏览器 Web 组件清除缓存相关,具体实现如下 code 实例所示: /*公共方法类*/ export class PublicUtils {/*获取缓存大小*/static async getCacheSize(): Promise<number> {try {let bundleStats await storageStatistics.getCurrentBundleStats()let size bundleS…...
在Unreal Engine中,UHT与反射机制
UHT(Unreal Header Tool) 是虚幻引擎(Unreal Engine)中的一个重要工具,它用于处理和生成引擎所需的元数据,使得虚幻引擎能够执行许多复杂的功能,如反射、序列化、蓝图交互、垃圾回收等。简而言之…...
SQL项目实战与综合应用——项目设计与需求分析
项目设计与需求分析是软件开发过程中的核心环节,尤其在涉及数据库的应用时,良好的设计将直接影响到项目的可扩展性、性能和维护性。本文将深入探讨数据库设计的最佳实践,结合 C 与 SQL 的实际应用场景,涵盖项目需求收集、数据库设…...
分布式中的CAP定理和BASE理论与强弱一致性
分布式中的CAP定理和BASE理论与强弱一致性 CAP定理 CAP定理,也称为布鲁尔定理(Brewer’s Theorem),是由加州大学伯克利分校的Eric Brewer教授在2000年提出的,并由麻省理工学院的Seth Gilbert和Nancy Lynch于2002年正…...
C/C++常见符号与运算符
C/C常见符号与运算符对照表 符号用法与意义与Java类比:在条件运算符中 (cond ? x : y) 表示条件为假的分支;在 switch-case 中如 case 1:表示标签结束点;在自定义标签如 label: 中用于 goto 跳转Java中? :三元运算相同;switch-case中也有:…...
了解 k8s 网络基础知识
了解 Docker 网络模式 在使用 Docker run 创建 Docker 容器时,可以使用 --net 选项指定容器的网络模式,Docker 可以有4种网络模式。 host 模式。–nethost 指定和宿主机共用一个 NetWork Namespace,容器中的网络环境(ip 地址、路…...
用户信息界面按钮禁用+发送消息功能
用户信息界面按钮禁用发送消息功能 前言 那么在上一集我们就完成了个人信息窗口所有的内容的修改,那么我们就需要进一步来看我们别的用户的信息界面的窗口。 需求分析 在之前的我们也讲了用户信息界面窗口一共有下图几种组件。 用户头像、用户id、用户昵称、用户…...
接近开关传感器-PCB线图电感式传感器【衰减系数1】
设计和工作原理 衰减系数为1的传感器是在电感式接近开关的基础上装备了特殊的振荡器。传感器内部有两个耦合空心线圈,能够保证根据不同的金属特性作合适的检测调整。无需考虑目标物是不同的金属,因为传感器能在同一感应距离下检测所有金属。 衰减系数为…...
C/C++流星雨
系列文章 序号直达链接1C/C爱心代码2C/C跳动的爱心3C/C李峋同款跳动的爱心代码4C/C满屏飘字表白代码5C/C大雪纷飞代码6C/C烟花代码7C/C黑客帝国同款字母雨8C/C樱花树代码9C/C奥特曼代码10C/C精美圣诞树11C/C俄罗斯方块12C/C贪吃蛇13C/C孤单又灿烂的神-鬼怪14C/C闪烁的爱心15C/C…...
计算机网络:传输层、应用层、网络安全、视频/音频/无线网络、下一代因特网
目录 (五)传输层 1.传输层寻址与端口 2.无连接服务与面向连接服务 3. 传输连接的建立与释放 4. UDP 的优点 5. UDP 和 TCP 报文段报头格式 6. TCP 的流量控制 7.TCP 的拥塞控制 8. TCP 传送连接的管理 &#…...
[漏洞挖掘与防护] 05.CVE-2018-12613:phpMyAdmin 4.8.1后台文件包含缺陷复现及防御措施
这是作者新开的一个专栏——“漏洞挖掘与防护”,前期会复现各种经典和最新漏洞,并总结防护技巧;后期尝试从零学习漏洞挖掘技术,包括Web漏洞和二进制及IOT相关漏洞,以及Fuzzing技术。新的征程,新的开启,漫漫长征路,偏向虎山行。享受过程,感谢您的陪伴,一起加油~ 欢迎关…...
GroundingDINO微调训练_训练日志解释
文章目录 1. 训练日志1. Epoch 和 Iteration2. Learning Rate(学习率)3. ETA(预计剩余时间)4. Time 和 Data Time5. Memory6. Gradient Norm(梯度范数)7. Loss(损失)8. Individual L…...
【0362】Postgres内核 XLogReaderState readBuf 有完整 XLOG page header 信息 ? ( 7 )
上一篇: 【0361】Postgres内核 page_read 读取所请求数据长度(至少 short page header)( 6 ) 文章目录 1. 检查 page_read 返回值 readLen2. 根据 readBuf 计算 XLogPageHeader 大小2.1 验证 XLOG Page header2.2 更新 XLogReaderState 读取状态信息1. 检查 page_read 返回…...
H5接入Steam 获取用户数据案例 使用 OpenID 登录绑定公司APP账户 steam公开用户信息获取 steam webapi文档使用
官方文档地址 1.注册 Steam API Key: 你需要一个 Steam Web API Key,可以在 Steam API Key 页面 获取。https://steamcommunity.com/dev/apikey 这里开发做demo用自己steam账户的就好,后续上线要用公司的账户 2.使用 OpenID 登录ÿ…...
pytorch多GPU训练教程
pytorch多GPU训练教程 文章目录 pytorch多GPU训练教程1. Torch 的两种并行化模型封装1.1 DataParallel1.2 DistributedDataParallel 2. 多GPU训练的三种架构组织方式2.2 数据不拆分,模型拆分(Model Parallelism)2.3 数据拆分,模型…...
力扣--LCR 178.训练计划VI
题目 教学过程中,教练示范一次,学员跟做三次。该过程被混乱剪辑后,记录于数组 actions,其中 actions[i] 表示做出该动作的人员编号。请返回教练的编号。 示例 1: 输入:actions [5, 7, 5, 5] 输出&#…...
基于大模型的 UI 自动化系统
基于大模型的 UI 自动化系统 下面是一个完整的 Python 系统,利用大模型实现智能 UI 自动化,结合计算机视觉和自然语言处理技术,实现"看屏操作"的能力。 系统架构设计 #mermaid-svg-2gn2GRvh5WCP2ktF {font-family:"trebuchet ms",verdana,arial,sans-…...
django filter 统计数量 按属性去重
在Django中,如果你想要根据某个属性对查询集进行去重并统计数量,你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求: 方法1:使用annotate()和Count 假设你有一个模型Item,并且你想…...
Nuxt.js 中的路由配置详解
Nuxt.js 通过其内置的路由系统简化了应用的路由配置,使得开发者可以轻松地管理页面导航和 URL 结构。路由配置主要涉及页面组件的组织、动态路由的设置以及路由元信息的配置。 自动路由生成 Nuxt.js 会根据 pages 目录下的文件结构自动生成路由配置。每个文件都会对…...
从零实现STL哈希容器:unordered_map/unordered_set封装详解
本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说,直接开始吧! 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...
GitHub 趋势日报 (2025年06月08日)
📊 由 TrendForge 系统生成 | 🌐 https://trendforge.devlive.org/ 🌐 本日报中的项目描述已自动翻译为中文 📈 今日获星趋势图 今日获星趋势图 884 cognee 566 dify 414 HumanSystemOptimization 414 omni-tools 321 note-gen …...
Map相关知识
数据结构 二叉树 二叉树,顾名思义,每个节点最多有两个“叉”,也就是两个子节点,分别是左子 节点和右子节点。不过,二叉树并不要求每个节点都有两个子节点,有的节点只 有左子节点,有的节点只有…...
图表类系列各种样式PPT模版分享
图标图表系列PPT模版,柱状图PPT模版,线状图PPT模版,折线图PPT模版,饼状图PPT模版,雷达图PPT模版,树状图PPT模版 图表类系列各种样式PPT模版分享:图表系列PPT模板https://pan.quark.cn/s/20d40aa…...
使用 SymPy 进行向量和矩阵的高级操作
在科学计算和工程领域,向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能,能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作,并通过具体…...
C++使用 new 来创建动态数组
问题: 不能使用变量定义数组大小 原因: 这是因为数组在内存中是连续存储的,编译器需要在编译阶段就确定数组的大小,以便正确地分配内存空间。如果允许使用变量来定义数组的大小,那么编译器就无法在编译时确定数组的大…...
springboot整合VUE之在线教育管理系统简介
可以学习到的技能 学会常用技术栈的使用 独立开发项目 学会前端的开发流程 学会后端的开发流程 学会数据库的设计 学会前后端接口调用方式 学会多模块之间的关联 学会数据的处理 适用人群 在校学生,小白用户,想学习知识的 有点基础,想要通过项…...
