当前位置: 首页 > 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个小时完…...

Oracle查询表空间大小

1 查询数据库中所有的表空间以及表空间所占空间的大小 SELECTtablespace_name,sum( bytes ) / 1024 / 1024 FROMdba_data_files GROUP BYtablespace_name; 2 Oracle查询表空间大小及每个表所占空间的大小 SELECTtablespace_name,file_id,file_name,round( bytes / ( 1024 …...

Linux简单的操作

ls ls 查看当前目录 ll 查看详细内容 ls -a 查看所有的内容 ls --help 查看方法文档 pwd pwd 查看当前路径 cd cd 转路径 cd .. 转上一级路径 cd 名 转换路径 …...

ffmpeg(四):滤镜命令

FFmpeg 的滤镜命令是用于音视频处理中的强大工具&#xff0c;可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下&#xff1a; ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜&#xff1a; ffmpeg…...

3403. 从盒子中找出字典序最大的字符串 I

3403. 从盒子中找出字典序最大的字符串 I 题目链接&#xff1a;3403. 从盒子中找出字典序最大的字符串 I 代码如下&#xff1a; class Solution { public:string answerString(string word, int numFriends) {if (numFriends 1) {return word;}string res;for (int i 0;i &…...

Linux C语言网络编程详细入门教程:如何一步步实现TCP服务端与客户端通信

文章目录 Linux C语言网络编程详细入门教程&#xff1a;如何一步步实现TCP服务端与客户端通信前言一、网络通信基础概念二、服务端与客户端的完整流程图解三、每一步的详细讲解和代码示例1. 创建Socket&#xff08;服务端和客户端都要&#xff09;2. 绑定本地地址和端口&#x…...

让回归模型不再被异常值“带跑偏“,MSE和Cauchy损失函数在噪声数据环境下的实战对比

在机器学习的回归分析中&#xff0c;损失函数的选择对模型性能具有决定性影响。均方误差&#xff08;MSE&#xff09;作为经典的损失函数&#xff0c;在处理干净数据时表现优异&#xff0c;但在面对包含异常值的噪声数据时&#xff0c;其对大误差的二次惩罚机制往往导致模型参数…...

MySQL 知识小结(一)

一、my.cnf配置详解 我们知道安装MySQL有两种方式来安装咱们的MySQL数据库&#xff0c;分别是二进制安装编译数据库或者使用三方yum来进行安装,第三方yum的安装相对于二进制压缩包的安装更快捷&#xff0c;但是文件存放起来数据比较冗余&#xff0c;用二进制能够更好管理咱们M…...

并发编程 - go版

1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程&#xff0c;系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...

多模态图像修复系统:基于深度学习的图片修复实现

多模态图像修复系统:基于深度学习的图片修复实现 1. 系统概述 本系统使用多模态大模型(Stable Diffusion Inpainting)实现图像修复功能,结合文本描述和图片输入,对指定区域进行内容修复。系统包含完整的数据处理、模型训练、推理部署流程。 import torch import numpy …...

6个月Python学习计划 Day 16 - 面向对象编程(OOP)基础

第三周 Day 3 &#x1f3af; 今日目标 理解类&#xff08;class&#xff09;和对象&#xff08;object&#xff09;的关系学会定义类的属性、方法和构造函数&#xff08;init&#xff09;掌握对象的创建与使用初识封装、继承和多态的基本概念&#xff08;预告&#xff09; &a…...