当前位置: 首页 > news >正文

【学习】【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="替代文本" />:图像元素,注意所有空标签必须闭合。

相关文章:

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

HTML 什么是 HTML&#xff1f; HTML (HyperText Markup Language) 是一种用于创建和展示网页的标准标记语言。它由一系列的元素组成&#xff0c;这些元素通过标签的形式来告诉浏览器如何显示内容。 HTML 的基本结构是什么&#xff1f; <!DOCTYPE html> <html> …...

ARM中ZI-data段和RW-data段

ARM中ZI-data段和RW-data段 1、只定义全局变量&#xff0c;不使用&#xff0c;不占用内存空间2、 定义并初始化全局变量为0 占用ZI-Data区域3、定义并初始化全局变量非0 占用RW-Data区域4、增加的是一个int8的数据为什么&#xff0c;size增加不是15、定义的全局变量为0&#xf…...

关联度分析、灰色预测GM(1,1)、GM(1,1)残差模型——基于Python实现

关联度分析 import numpy as np import pandas as pd #关联度分析 #参考序列 Y_0[170,174,197,216.4,235.8] #被比较序列 Y_1[195.4,189.9,187.2,205,222.7] Y_2[308,310,295,346,367]#初始化序列 X_0np.array(Y_0)/Y_0[0] X_1np.array(Y_1)/Y_1[0] X_2np.array(Y_2)/Y_2[0]#计…...

linux常用命令(网络相关)

目录 1. ping - 检查网络连通性 参数 示例 2. ifconfig - 配置网络接口 参数 示例 3. ip - 显示和操作路由、网络设备、接口等 参数 示例 4. netstat - 显示网络连接、路由表、接口统计等信息 参数 示例 5. ss - 更快的netstat替代品 参数 示例 6. nslookup - …...

【uni-app多端】修复stmopjs下plus-websocket无心跳的问题

从这篇文章接着向下看&#xff1a; uniapp plus-websocket 和stompjs连接教程 安卓ios手机端有效 - 简书 按照文章的方式&#xff0c;能够实现APP下stmopjs长连接。但是有一个问题&#xff0c;就是会频繁输出 res-创建连接-1- 跟踪连接&#xff0c;会发现连接都会在大约40s后…...

VScode学习前端-01

小问题合集&#xff1a; vscode按&#xff01;有时候没反应&#xff0c;有时候出来&#xff0c;是因为------>必须在英文状态下输入&#xff01; 把鼠标放在函数、变量等上面&#xff0c;会自动弹出提示&#xff0c;但挡住视线&#xff0c;有点不习惯。 打开file->pre…...

Java-05 深入浅出 MyBatis - 配置深入 动态 SQL 参数、循环、片段

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; 大数据篇正在更新&#xff01;https://blog.csdn.net/w776341482/category_12713819.html 目前已经更新到了&#xff1a; MyBatis&#xff…...

突破自动驾驶瓶颈!KoMA:多智能体与大模型的完美融合

0.简介 本推文主要介绍了由来自北京航空航天大学的姜克谋、蔡轩和崔智勇教授等共同提出的一种名为KoMA的知识驱动的多智能体框架。论文《KoMA: Knowledge-driven Multi-agent Framework for Autonomous Driving with Large Language Models》提出了KoMA框架&#xff0c;通过结…...

YOLO入门教程(三)——训练自己YOLO11实例分割模型并预测【含教程源码+一键分类数据集 + 故障排查】

目录 引言前期准备Step0 环境部署1.安装OpenCV2.安装Pytorch3.安装Ultralytics Step1 打标训练Step2 格式转换Step3 整理训练集Step4 训练数据集4.1创建yaml文件4.2训练4.3预测4.4故障排查4.4.1OpenCV版本故障&#xff0c;把OpenCV版本升级到4.0以上4.4.2NumPy版本故障&#xf…...

【加入默语老师的私域】C#面试题

什么是依赖注入&#xff0c;如何实现&#xff1f; 依赖注入是一种设计模式。我们不是直接在另一个类&#xff08;依赖类&#xff09;中创建一个类的对象&#xff0c;而是将对象作为参数传递给依赖类的构造函数。它有助于编写松散耦合的代码&#xff0c;并有助于使代码更加模块…...

称重传感器指示器行业全面且深入的分析

称重传感器指示器是一种用于显示和解释称重传感器输出信号的设备&#xff0c;用于测量力、重量或压力。称重传感器是将物理力&#xff08;如重量&#xff09;转换为电信号的传感器&#xff0c;称重传感器指示器将该电信号转换为可读格式&#xff0c;通常以磅、公斤或牛顿等单位…...

NAT网络地址转换——Easy IP

NAT网络地址转换 Tip&#xff1a; EasylP没有地址池的概念,使用接口地址作为NAT转换的公有地址。EasylP适用于不具备固定公网IP地址的场景:如通过DHCP, PPPOE拨号获取地址的私有网络出口,可以直接使用获取到的动态地址进行转换。 本次实验模拟nat协议配置 AR1配置如下&…...

【Visual Studio系列教程】如何在 VS 上编程?

上一篇博客中&#xff0c;我们介绍了《什么是 Visual Studio&#xff1f;》。本文&#xff0c;我们来看第2篇《如何在 VS 上编程&#xff1f;》。阅读本文大约10 分钟。我们会向文件中添加代码&#xff0c;了解 Visual Studio 编写、导航和了解代码的简便方法。 本文假定&…...

Mybatis-Plus 多租户插件属性自动赋值

文章目录 1、Mybatis-Plus 多租户插件1.1、属性介绍1.2、使用多租户插件mavenymlThreadLocalUtil实现 定义,注入租户处理器插件测试domianservice & ServiceImplmapper 测试mapper.xml 方式 1.3、不使用多租户插件 2、实体对象的属性自动赋值使用1. 定义实体类2. 实现 Meta…...

AWTK-WIDGET-WEB-VIEW 实现笔记 (4) - Ubuntu

Ubuntu 上实现 AWTK-WIDGET-WEB-VIEW 开始以为很简单&#xff0c;后来发现是最麻烦的。因为 Ubuntu 上的 webview 库是 基于 GTK 的&#xff0c;而 AWTK 是基于 X11 的&#xff0c;两者的窗口系统不同&#xff0c;所以期间踩了几个大坑。 1. 编译 AWTK 在使用 Linux 的输入法时…...

Python入门(7)--高级函数特性详解

Python高级函数特性详解 &#x1f680; 目录 匿名函数&#xff08;Lambda&#xff09;装饰器的使用生成器与迭代器递归函数应用实战案例&#xff1a;文件批处理工具 1. 匿名函数&#xff08;Lambda&#xff09;深入解析 &#x1f3af; 1.1 Lambda函数基础与进阶 1.1.1 基本…...

【数据库原理】理解数据库,基础知识

第一代&#xff1a;网状数据库&#xff1b;第二代&#xff1a;关系数据库&#xff1b;第三代&#xff1a;新一代数据库系统BigData 一、理解数据库 什么是数据&#xff1a;信息&#xff0c;对事物的存在方方式、运动状态及特征的描述。数据&#xff0c;记录信息的识别方式有数…...

VConsole——(H5调试工具)前端开发使用于手机端查看控制台和请求发送

因为开发钉钉H5微应用在手机上一直查看不到日志等&#xff0c;出现安卓和苹果上传图片一边是成功的&#xff0c;一边是失败的&#xff0c;所以找了这个&#xff0c;之前在开发微信小程序进行调试的时候能看到&#xff0c;之前没想到过&#xff0c;这次被人提点发现可以单独使用…...

论文分享 | FuzzLLM:一种用于发现大语言模型中越狱漏洞的通用模糊测试框架

大语言模型是当前人工智能领域的前沿研究方向&#xff0c;在安全性方面大语言模型存在一些挑战和问题。分享一篇发表于2024年ICASSP会议的论文FuzzLLM&#xff0c;它设计了一种模糊测试框架&#xff0c;利用模型的能力去测试模型对越狱攻击的防护水平。 论文摘要 大语言模型中…...

vmWare虚拟环境centos7安装Hadoop 伪分布式实践

背景&#xff1a;近期在研发大数据中台&#xff0c;需要研究Hadoop hive 的各种特性&#xff0c;需要搭建一个Hadoop的虚拟环境&#xff0c;本来想着使用dock &#xff0c;但突然发现docker 公共仓库的镜像 被XX 了&#xff0c;无奈重新使用vm 搭建虚拟机。 大概经历了6个小时完…...

华为光猫配置解密工具:网络运维的终极解决方案

华为光猫配置解密工具&#xff1a;网络运维的终极解决方案 【免费下载链接】HuaWei-Optical-Network-Terminal-Decoder 项目地址: https://gitcode.com/gh_mirrors/hu/HuaWei-Optical-Network-Terminal-Decoder 华为光猫配置解密工具是一款专为网络工程师和运维人员设计…...

Blender 3MF插件:终极3D打印工作流解决方案

Blender 3MF插件&#xff1a;终极3D打印工作流解决方案 【免费下载链接】Blender3mfFormat Blender add-on to import/export 3MF files 项目地址: https://gitcode.com/gh_mirrors/bl/Blender3mfFormat 在3D打印的世界里&#xff0c;你是否曾为文件格式转换而头疼&…...

QMCDecode:解锁QQ音乐加密文件,三步实现音乐格式自由转换

QMCDecode&#xff1a;解锁QQ音乐加密文件&#xff0c;三步实现音乐格式自由转换 【免费下载链接】QMCDecode QQ音乐QMC格式转换为普通格式(qmcflac转flac&#xff0c;qmc0,qmc3转mp3, mflac,mflac0等转flac)&#xff0c;仅支持macOS&#xff0c;可自动识别到QQ音乐下载目录&am…...

环境配置与基础教程:保姆级教程:VS Code DevContainer 一键构建可复现的 YOLO 训练开发容器

摘要 你是否还在为YOLO训练环境的搭建而焦头烂额?CUDA版本不匹配、Python依赖冲突、团队协作时“在我机器上能跑”的经典难题——这些问题浪费了无数开发者的宝贵时间。本文将带你通过VS Code DevContainer技术,一键构建完全可复现的YOLO训练开发容器,彻底告别环境配置噩梦…...

保姆级教程:用STM32F103C8T6的ADC读取MPX4250压力传感器数据(附完整代码)

从零开始&#xff1a;STM32F103C8T6驱动MPX4250压力传感器全流程解析 硬件准备与传感器基础 MPX4250作为工业级压力传感器&#xff0c;其核心优势在于宽量程&#xff08;20-250kPa&#xff09;和出色的线性输出特性。这款传感器采用硅压阻技术&#xff0c;内部集成了温度补偿…...

让老旧游戏手柄重获新生:XOutput游戏手柄兼容工具使用指南

让老旧游戏手柄重获新生&#xff1a;XOutput游戏手柄兼容工具使用指南 【免费下载链接】XOutput DirectInput to XInput wrapper 项目地址: https://gitcode.com/gh_mirrors/xo/XOutput 还在为心爱的老手柄无法玩新游戏而烦恼吗&#xff1f;XOutput是一款专门解决Direct…...

ARM9EJ-S核心调试技术与系统速度访问机制解析

1. ARM9EJ-S核心调试技术概述 在嵌入式系统开发领域&#xff0c;调试技术的重要性不亚于代码编写本身。ARM9EJ-S作为经典的嵌入式处理器核心&#xff0c;其调试子系统设计体现了ARM架构对开发效率的深度考量。这套调试系统不仅仅是简单的"暂停-查看"工具&#xff0c;…...

AI新闻链接汇总(2026-05-10)

AI新闻链接汇总&#xff08;2026-05-10&#xff09; 一、斯坦福大学发布《2026年人工智能指数报告》&#xff1a;美国领跑模型开发&#xff0c;中国主导机器人部署 斯坦福大学以人为本人工智能研究院于2026年4月13日正式发布《2026年人工智能指数报告》&#xff0c;这份长达4…...

PIDtoolbox完全指南:3步掌握无人机黑盒日志分析的终极免费工具

PIDtoolbox完全指南&#xff1a;3步掌握无人机黑盒日志分析的终极免费工具 【免费下载链接】PIDtoolbox PIDtoolbox is a set of graphical tools for analyzing blackbox log data 项目地址: https://gitcode.com/gh_mirrors/pi/PIDtoolbox 你是否曾面对无人机的飞行日…...

终极显卡驱动清理指南:如何彻底解决驱动残留问题

终极显卡驱动清理指南&#xff1a;如何彻底解决驱动残留问题 【免费下载链接】display-drivers-uninstaller Display Driver Uninstaller (DDU) a driver removal utility / cleaner utility 项目地址: https://gitcode.com/gh_mirrors/di/display-drivers-uninstaller …...