【学习】【HTML】HTML、XML、XHTML

HTML

什么是 HTML？

HTML (HyperText Markup Language) 是一种用于创建和展示网页的标准标记语言。它由一系列的元素组成，这些元素通过标签的形式来告诉浏览器如何显示内容。

HTML 的基本结构是什么？

<!DOCTYPE html>
<html>
<head><title>页面标题</title>
</head>
<body><h1>主标题</h1><p>这是页面的内容。</p>
</body>
</html>
  • <!DOCTYPE html>：声明文档类型为 HTML5。
  • <html>：根元素，包裹整个 HTML 文档。
  • <head>：包含文档的元数据，如标题、字符集、样式表链接等。
  • <title>：定义文档的标题，显示在浏览器的标签页上。
  • <body>：包含文档的所有可见内容，如文本、图像、视频等。

什么是 HTML5？

  • HTML5 是第五个主要版本的 HTML，旨在改进 Web 应用的功能和性能。
  • 引入了许多新特性，如语义化标签、多媒体支持、表单控件、本地存储等。

HTML5 有哪些新特性？

  • 语义化标签：如 <header>, <footer>, <nav>, <article>, <section> 等。
  • 多媒体支持：<audio> 和 <video> 标签。
  • 表单控件：新的输入类型，如 email, date, range 等。
  • 本地存储：localStorage 和 sessionStorage。
  • Canvas：绘图区域，支持动态绘图和动画。
  • Web Workers：后台线程，支持复杂计算任务。

HTML 的 DOCTYPE 是什么？为什么需要它？

DOCTYPE 是什么？
是一个文档类型声明（Document Type Declaration），用于告知浏览器页面使用的 HTML 或 XHTML 版本。它位于 HTML 文档的最前面，紧接在任何其他内容之前。 并不是一个 HTML 标签，而是一个指令，告诉浏览器如何解析和渲染页面。
为什么需要它？
  1. 触发标准模式：
  • 浏览器在解析 HTML 文档时，会根据 <!DOCTYPE> 声明来决定使用哪种模式来渲染页面。如果 <!DOCTYPE> 存在并且格式正确，浏览器将以标准模式（Standards Mode）渲染页面，这意味着浏览器将严格按照 W3C 规范来解析和渲染 HTML 和 CSS。
  • 如果 <!DOCTYPE> 缺失或格式不正确，浏览器可能会进入怪异模式（Quirks Mode）。在怪异模式下，浏览器会模仿旧版浏览器的行为，以保持对旧网站的兼容性。这种方式可能导致页面布局和样式出现不可预测的问题。
  1. 定义文档类型：
  • 声明指定了文档遵循的 HTML 或 XHTML 版本。例如，HTML5 使用 `` 表示这是一个 HTML5 文档。对于早期的 HTML 和 XHTML 版本， 声明会更加详细，包含 DTD（文档类型定义）的引用，这有助于验证文档结构是否符合特定的标准。
  1. 提高跨浏览器兼容性：
  • 正确的 <!DOCTYPE> 声明有助于确保你的网页在不同浏览器中具有一致的表现。因为不同的浏览器在标准模式下的行为更为一致，而在怪异模式下则可能表现各异。使用标准模式可以减少因浏览器差异导致的问题。
    小结
声明虽然简单，但在确保网页正确解析和渲染方面起着至关重要的作用。建议在编写 HTML 文档时，始终在文档的最开始处添加一个合适的 声明，以确保最佳的兼容性和表现。

HTML 中的 meta 标签有什么作用？

  • <meta> 标签用于提供文档的元数据，如字符集、描述、关键词等。例如，<meta charset="UTF-8"> 设置字符编码，<meta name="description" content="页面描述"> 提供页面描述。

XML

什么是 XML？

  • XML 是一种用于存储和传输数据的标记语言。
  • 强调数据的结构化表示，要求所有标签必须正确闭合，并且区分大小写。

XML 的基本结构是什么？

<?xml version="1.0" encoding="UTF-8"?>
<catalog><book id="bk101"><author>Gambardella, Matthew</author><title>XML Developer's Guide</title></book>
</catalog>
  • <?xml version="1.0" encoding="UTF-8"?>：声明文档的版本和字符编码。
  • <catalog>：根元素，包裹整个 XML 文档。
  • <book>：子元素，表示一本书。
  • id="bk101"：属性，提供额外的信息。
  • <author>、<title>：子元素，表示书的不同属性。

什么是 DTD 和 XML Schema？

  • DTD (Document Type Definition)：定义了 XML 文档的合法结构。
  • XML Schema：类似于 DTD，但功能更强大，使用 XML 语法定义，支持数据类型、复杂的数据结构等。

如何解析 XML 数据？

  • 使用 DOMParser 解析器：将整个 XML 文档加载到内存中，形成一个树状结构。

XHTML

什么是 XHTML？

  • XHTML 是 HTML 的一个更严格的版本，结合了 HTML 和 XML 的特性。
  • 要求所有标签必须闭合，属性值必须用引号括起来，且所有标签名和属性名都必须小写。
  • XHTML 提供了模块化的设计，允许开发者根据需要选择不同的模块来构建文档。
  • 最终被 HTML5 取代。

XHTML 的基本结构是什么？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>页面标题</title>
</head>
<body><h1>主标题</h1><p>这是页面的内容。</p>
</body>
</html>
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">：声明文档类型为 XHTML 1.0 严格模式。
  • <html xmlns="http://www.w3.org/1999/xhtml">：根元素，指定命名空间。
  • <head>：包含文档的元数据，如标题、字符集、样式表链接等。
  • <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />：定义文档的字符编码。
  • <title>：定义文档的标题，显示在浏览器的标签页上。
  • <body>：包含文档的所有可见内容，如文本、图像、视频等。
  • <img src="image.jpg" alt="替代文本" />：图像元素，注意所有空标签必须闭合。

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

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

相关文章

修改yolo格式的labels类别、删除yolo格式的labels类别

修改yolo格式的labels类别、删除yolo格式的labels类别

1、项目中&#xff0c;数据集的类别顺序有时会改变&#xff0c;例如a项目类别1是b项目的类别3&#xff0c;&#xff0c;需要用a项目的数据集&#xff0c;只需要改类别就行&#xff0c;就不需要重新标注了&#xff0c;例如a项目的classes是 b项目的classes是 a项目的数据可以用…
阅读更多...
Java项目实战II基于微信小程序的个人行政复议在线预约系统微信小程序（开发文档+数据库+源码）

Java项目实战II基于微信小程序的个人行政复议在线预约系统微信小程序（开发文档+数据库+源码）

目录 一、前言 二、技术介绍 三、系统实现 四、文档参考 五、核心代码 六、源码获取 全栈码农以及毕业设计实战开发&#xff0c;CSDN平台Java领域新星创作者&#xff0c;专注于大学生项目实战开发、讲解和毕业答疑辅导。获取源码联系方式请查看文末 一、前言 基于微信小…
阅读更多...
Kubernetes在容器编排中的应用

Kubernetes在容器编排中的应用

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 Kubernetes在容器编排中的应用 Kubernetes在容器编排中的应用 Kubernetes在容器编排中的应用 引言 Kubernetes 概述 定义与原理 …
阅读更多...
D67【python 接口自动化学习】- python基础之数据库

D67【python 接口自动化学习】- python基础之数据库

day67 Python操作MySQL基础使用 学习日期&#xff1a;20241113 学习目标&#xff1a;MySQL数据库-- 136 Python操作MySQL基础使用 学习笔记&#xff1a; pymysql 创建MySQL的数据库链接 执行sql语句 总结 Python中使用第三方库&#xff1a;pymysql来操作MySQL&#xff0c;…
阅读更多...
GitLab基于Drone搭建持续集成（CI/CD）

GitLab基于Drone搭建持续集成（CI/CD）

本文介绍了如何为 Gitee 安装 Drone 服务器。服务器打包为在 DockerHub 上分发的最小 Docker 映像。 1. 准备工作 创建OAuth应用 创建 GitLab OAuth 应用。Consumer Key 和 Consumer Secret 用于授权访问极狐GitLab 资源。 ps:授权回调 URL 必须与以下格式和路径匹配&…
阅读更多...
python实战（八）——情感识别（多分类）

python实战（八）——情感识别（多分类）

一、任务目标 本文使用的是来自Kaggle的一个情感识别数据集&#xff0c;这个数据集的总数据量是5934条&#xff0c;标签为anger、fear、joy三种情感的其中一种&#xff0c;很明显是一个多分类任务。这里&#xff0c;我们将使用微调技巧进行深度学习建模&#xff0c;同时我们会比…
阅读更多...
【学习笔记】数据结构（七）

【学习笔记】数据结构（七）

图 文章目录 图7.1 图的定义和术语7.2 图的存储结构7.2.1 数组表示法 - 邻接矩阵&#xff08;Adjacency Matrix)7.2.2 邻接表 -&#xff08;链式&#xff09;表示法(Adjacency List&#xff09;7.2.3 十字链表(Orthogonal List)7.2.4 邻接多重表(Adjacent MultiList) 7.3 图的遍…
阅读更多...
scrapy爬取中信证券销售金融产品信息

scrapy爬取中信证券销售金融产品信息

import scrapyclass CsProductSpider(scrapy.Spider):name "cs_product"allowed_domains ["www.cs.ecitic.com"]start_urls ["http://www.cs.ecitic.com/newsite/cpzx/jrcpxxgs/zgcp/index.html"]def parse(self, response):# 提取数据的逻辑…
阅读更多...
power bi中的related函数解析

power bi中的related函数解析

在Power BI中&#xff0c;RELATED函数是一种用于检索相关表中数据的函数。它用于在一个表中检索与当前行相关联的另一个表中的数据。 销售成本 [销售数量]*related(商品表[进价])
阅读更多...
Ollama的安装以及大模型下载教程

Ollama的安装以及大模型下载教程

简介 Ollama是一个开源的大型语言模型服务工具&#xff0c;它帮助用户快速在本地运行大模型。通过简单的安装指令&#xff0c;用户可以执行一条命令就在本地运行开源大型语言模型&#xff0c; Ollama极大地简化了在Docker容器内部署和管理LLM的过程&#xff0c;使得用户能够快…
阅读更多...
算法演练----24点游戏

算法演练----24点游戏

给定4个整数&#xff0c;数字范围在1~13之间任意使用-*/&#xff08;&#xff09;&#xff0c;构造出一个表达式&#xff0c;使得最终结果为24&#xff0c; 方法一 算法分析&#xff1a;加括号和取出重复表达式 # 导入精确除法模块&#xff0c;使得在Python2中除法运算的行为更…
阅读更多...
YUM 的使用

YUM 的使用

YUM 是一个用于 Fedora 和 Red Hat 以及 CentOS 操作系统的前端软件包管理器&#xff0c;它可以自动处理依赖关系并一次性安装所有必需的软件包。 镜像站点选择 1. 备份原有的镜像源配置文件 系统默认的 yum 镜像源配置文件存储在 /etc/yum.repos.d/ 目录下&#xff0c;可以…
阅读更多...
第三十六章 Vue之路由重定向/404页面设置/路径模式设置

第三十六章 Vue之路由重定向/404页面设置/路径模式设置

目录 一、路由重定向 1.1. 使用方式 1.2. 完整代码 1.2.1. main.js 1.2.2. App.vue 1.2.3. index.js 1.2.4. Search.vue 1.2.5. Home.vue 1.3. 运行效果 二、设定404错误页面 2.1. 使用方式 2.2. 完整代码 2.2.1. index.js 2.2.2. NotFound.vue 2.2.3. 运行效…
阅读更多...
鸿蒙进阶篇-属性动画-animateTo转场动画

鸿蒙进阶篇-属性动画-animateTo转场动画

大家好啊&#xff0c;这里是鸿蒙开天组&#xff0c;今天我们来学习属性动画-animateTo&转场动画&#xff0c;咱们先来学习属性动画-animateTo 属性动画-animateTo 属性动画 animation是作为属性使用&#xff0c;而animateTo显示动画是一个系统的内置函数&#xff0c;可以…
阅读更多...
[CKS] K8S ServiceAccount Set Up

[CKS] K8S ServiceAccount Set Up

最近准备花一周的时间准备CKS考试&#xff0c;在准备考试中发现有一个题目关于Rolebinding的题目。 ​ 专栏其他文章: [CKS] Create/Read/Mount a Secret in K8S-CSDN博客[CKS] Audit Log Policy-CSDN博客 -[CKS] 利用falco进行容器日志捕捉和安全监控-CSDN博客[CKS] K8S Netwo…
阅读更多...
Autosar CP DDS规范导读

Autosar CP DDS规范导读

Autosar CP DDS 主要用途 数据通信 中间件协议&#xff1a;作为一种中间件协议&#xff0c;DDS实现了应用程序之间的高效数据通信&#xff0c;能够在不同的软件组件和ECU之间传输数据&#xff0c;确保数据的实时性和可靠性。跨平台通信&#xff1a;支持在AUTOSAR CP平台上的不同…
阅读更多...
wafw00f源码详细解析

wafw00f源码详细解析

声明 本人菜鸟一枚&#xff0c;为了完成作业&#xff0c;发现网上所有的关于wafw00f的源码解析都是这抄那那抄这的&#xff0c;没有新东西&#xff0c;所以这里给出一个详细的源码解析&#xff0c;可能有错误&#xff0c;如果有大佬发现错误&#xff0c;可以在评论区平和的指出…
阅读更多...
字节、快手、Vidu“打野”升级，AI视频小步快跑

字节、快手、Vidu“打野”升级，AI视频小步快跑

文&#xff5c;白 鸽 编&#xff5c;王一粟 继9月份版本更新之后&#xff0c;光锥智能从生数科技联合创始人兼CEO唐家渝朋友圈获悉&#xff0c;Vidu大模型将于本周再次进行版本升级&#xff0c;Vidu-1.5版本即将上线。 此版本更新方向仍是重点延伸大模型的泛化能力和主体…
阅读更多...
LeetCode【0036】有效的数独

LeetCode【0036】有效的数独

本文目录 1 中文题目2 求解方法&#xff1a;python内置函数set2.1 方法思路2.2 Python代码2.3 复杂度分析 3 题目总结 1 中文题目 请根据以下规则判断一个 9 x 9 的数独是否有效。 数字 1-9 在每一行只能出现一次。数字 1-9 在每一列只能出现一次。数字 1-9 在每一个以粗实线…
阅读更多...
STM32 GPIO 配置

STM32 GPIO 配置

GPIO 八种工作模式 STM32的GPIO八种模式明解STM32—GPIO理论基础知识篇之八种工作模式stm32cubemx hal学习记录&#xff1a;GPIO输入输出[STM32G4系列] GPIO筆記 - CubeMX GPIO整理與應用 模拟量输入输出 ADC 【STM32】HAL库 STM32CubeMX教程九—ADC[通俗易懂] DAC STM32C…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023