三、HTML元素

news2025/1/12 20:42:03

一、HTML元素

  • HTML 文档由 HTML 元素定义。

  •  *开始标签常被称为起始标签(opening tag),结束标签常称为闭合标签(closing tag)

二、HTML 元素语法

  • HTML 元素以开始标签起始。
  • HTML 元素以结束标签终止。
  • 元素的内容是开始标签与结束标签之间的内容。
  • 某些 HTML 元素具有空内容(empty content)。
  • 空元素在开始标签中进行关闭(以开始标签的结束而结束)。
  • 大多数 HTML 元素可拥有属性。

三、嵌套的 HTML 元素

  • 大多数 HTML 元素可以嵌套(HTML 元素可以包含其他 HTML 元素)。
  • HTML 文档由相互嵌套的 HTML 元素构成。

 四、HTML 文档实例

<!DOCTYPE html>
<html>

<body>
<p>这是第一个段落。</p>
</body>

</html>
  • 以上实例包含了三个 HTML 元素。

1、HTML 实例解析

 <p> 元素:

<p>这是第一个段落。</p>
  • 这个 <p> 元素定义了 HTML 文档中的一个段落。
  • 这个元素拥有一个开始标签 <p> 以及一个结束标签 </p>。
  • 元素内容是: 这是第一个段落。

 <body> 元素:

<body>
<p>这是第一个段落。</p>
</body>
  •  <body> 元素定义了 HTML 文档的主体。
  • 这个元素拥有一个开始标签 <body> 以及一个结束标签 </body>。
  • 元素内容是另一个 HTML 元素(p 元素)。

<html> 元素:

<html>

<body>
<p>这是第一个段落。</p>
</body>

</html>
  •  <html> 元素定义了整个 HTML 文档。
  • 这个元素拥有一个开始标签 <html> ,以及一个结束标签 </html>。
  • 元素内容是另一个 HTML 元素(body 元素)。

五、不要忘记结束标签

  •  即使您忘记了使用结束标签,大多数浏览器也会正确地显示 HTML:
<p>这是一个段落
<p>这是一个段落
  • 以上实例在浏览器中也能正常显示,因为关闭标签是可选的。
  • 但不要依赖这种做法。忘记使用结束标签会产生不可预料的结果或错误。

六、HTML 空元素

  • 没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
  • <br> 就是没有关闭标签的空元素(<br> 标签定义换行)。
  • 在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
  • 在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。
  • 即使 <br> 在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。

七、HTML 提示:使用小写标签 

  • HTML 标签对大小写不敏感:<P> 等同于 <p>。
  • 许多网站都使用大写的 HTML 标签。
  • 万维网联盟(W3C)在 HTML 4 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Zero-shot:半监督:pansharpening

Zero-shot semi-supervised learning for pansharpening &#xff08;用于全色锐化的零次半监督学习&#xff09; 全色锐化是指融合低分辨率多光谱图像&#xff08;LRMS&#xff09;和高分辨率全色&#xff08;PAN&#xff09;图像以生成高分辨率多光谱图像&#xff08;HRMS&…

履机乘变,轻舟便楫:源启分布式PaaS深度赋能企业级技术平台建设

导语 源启分布式PaaS平台围绕应用视角为用户提供应用运行的全生命周期管控能力&#xff0c;提供注册中心、服务路由、网关、服务治理等中间件技术支持&#xff0c;实现应用之间的联通&#xff0c;解决客户多厂商产品不兼容、产品组合不可选择、孤岛效应等问题&#xff0c;满足…

CSS animation动画和关键帧实现轮播图效果HTML

CSS animation动画和关键帧实现轮播图效果HTML 这轮播图效果使用h5和css3实现效果&#xff0c;不需要js控制&#xff0c;但是其中的缺点就是不能使用鼠标进行切换效果。 具有代码如下 <!DOCTYPE html> <html lang"en"><head><meta charset&quo…

MACOS Atrust服务异常

MAC版Atrust服务异常 点击进入办公后出现提示其一&#xff1a; 核心服务未启动&#xff0c;部分功能存在异常&#xff0c;确定重新启动吗&#xff1f; 可能的原因&#xff1a; 1.上次已完全退出客户端 2.核心服务被其他程序优化禁用 点击重新启动后&#xff0c;出现提示&#x…

M3u8视频地址如何转为mp4视频

在当今数字化的时代&#xff0c;视频格式的转换已成为日常需求。M3u8格式的视频由于其分段的特性&#xff0c;常常给播放和编辑带来不便。而MP4格式则因其通用性和高质量而广受欢迎。那么&#xff0c;如何将M3u8视频地址转换为MP4格式呢&#xff1f;接下来&#xff0c;我们将为…

iOS 小组件开发

iOS14之后Apple引入了新的WidgetKit&#xff0c;舍弃了原有额TodayExtension。 开发准备&#xff1a; 新的WidgetExtension只能通过SwiftUI进行开发&#xff1b; Widget有三种尺寸&#xff1a;systemSmall、 systemMedium、systemLarge&#xff0c;三种尺寸对应固定的UI类型布…

从0创建springboot项目并创建GitHub仓库

创建springboot项目 我是使用idea来创建一个新的项目&#xff0c;jdk17&#xff0c;maven。 先选一个spring web就够了&#xff0c;后续需要啥功能再慢慢添加 写个简单controller测试一下能不能成功启动项目 启动项目&#xff0c;本地访问http://localhost:8080/test/test …

polar CTF web 被黑掉的站

一、题目 二、解答 1、dirsearch 扫目录 看到shell.php和index.php.bak 一看就是爆破&#xff0c;字典都给了&#xff0c;最后得到为 nikel

C++数据结构-广义表

广义表的定义 如果允许表中的数据元素具有自身结构&#xff0c;即数据元素也可以是一个线性表&#xff0c;这就是广义表&#xff0c;有时也称之为列表&#xff08;Lists&#xff09;。 广义表是n(n≥0)个元素a1, a2, …, an的有限序列&#xff0c;即LS(a1, a2, …, an)。 其…

Objects are not valid as a React child (found: object with keys {name}).

在jsx中可以嵌套表达式&#xff0c;将表达式作为内容的一部分&#xff0c;但是要注意&#xff0c;普通对象不能作为子元素&#xff1b;但是数组&#xff0c;react元素对象是可以的 如下&#xff1a;不能将stu这个对象作为子元素放 function App() {const myCal imgStyleconst…

深度生成模型之GAN的评估 ->(个人学习记录笔记)

文章目录 深度生成模型之GAN的评估图像翻译的应用1. 风格迁移2. 数据增强3. 经典图像任务4. 内容创作5. 人脸图像编辑6. 人体图像编辑 图像翻译模型1. 有监督图像翻译模型2. 无监督图像翻译模型3. 多域图像翻译模型 深度生成模型之GAN的评估 图像翻译的应用 1. 风格迁移 各类…

本地计算机 上的 My5OL808 服务启动后停止,某些服务在未由其他服务或程序使用时将自动停止

客户反馈说mysql启动不了&#xff0c;报错信息&#xff1a; 本地计算机 上的 My5OL808 服务启动后停止&#xff0c;某些服务在未由其他服务或程序使用时将自动停止。 查了不少资料&#xff0c;最后分析问题是这样的&#xff0c;手动或者重复安装mysql时&#xff0c;创建了多个…

计算机网络 VLAN

路由器将多个局域网连接起来&#xff0c;而交换机将一个局域网里的设备连接起来。 路由器的端口分配局域网的网段&#xff08;子网网段&#xff09;&#xff0c;局域网的内部设备的ip都在这个网段里&#xff0c;再由交换机将数据派发到目的设备&#xff0c;交换机是按照MAC地址…

欢迎提交pr共同改进项目, pr的含义?

"提交PR"在软件开发和编程领域是一个常用术语&#xff0c;特别是在使用版本控制系统如Git时。这里的“PR”指的是“Pull Request”&#xff0c;它是一种通知项目维护人员您已经完成了一些代码改动并希望将这些改动合并到主项目中的方式。简单来说&#xff0c;当您对一…

lenovo联想小新Pro-13 2020 Intel IML版笔记本电脑(82DN)原装出厂Win10系统镜像

链接&#xff1a;https://pan.baidu.com/s/1bJpfXudYEC7MJ7qfjDYPdg?pwdjipj 提取码&#xff1a;jipj 原装出厂Windows10系统自带所有驱动、出厂主题壁纸、系统属性专属LOGO标志、Office办公软件、联想电脑管家等预装程序 所需要工具&#xff1a;16G或以上的U盘 文件格式&a…

electron预加载脚本

webPreferences 指定预加载脚本,可以使用部分node脚本 webPreferences: {preload: path.join(__dirname, "preload.js"),},创建preload.js 中 测试文件读取功能 const fs require(fs) const text fs.readFileSync(package.json, utf-8)console.log(text)报错,为了…

Mac环境下反编译apk

Mac环境下反编译apk 安装反编译工具dex2jar&#xff1a;[官网下载](https://sourceforge.net/projects/dex2jar/)JD-GUI&#xff1a;[官网下载](https://jd-gui.apponic.com/) 实操1. 将需要反编译的 .apk 文件放在下载的 dex2jar 文件夹目录下2. 使用 cd /xxx/dex2jar-2.0 命令…

【algorithm】自动驾驶常见常考的几个模型和推导,顺便总结自己遇到的考题经验不断更新之———控制版

写在前面 本来快达成目标了&#xff0c;没想到公司遭受了问题&#xff0c;公司和同事我感觉还是挺好的&#xff0c;有国企的正规也有小企业的灵活&#xff0c;大家都很有学习欲望。 作为本次再次复习回忆如下&#xff1a; 把之前面试准备的 机器学习&#xff08;基本搬运到CSD…

安全与认证Week4

目录 本章需要理解的问题 Web Security (TLS/SSL) 关于网络 使用网络会受到的威胁 各层安全协议 S/MIME、PGP&#xff08;后面和S/MIME一起出现&#xff09;、Kerberos、TLS/SSL 和 IP/IPSec 分别是&#xff1a; S/MIME (Secure/Multipurpose Internet Mail Extensions)&#x…

js文件上传 分片上传/断点续传/极速秒传

(极速秒传)利用md5判断上传的文件是否存在 MD5信息摘要算法&#xff0c;一种被广泛使用的密码散列函数&#xff0c;可以产生出一个128位&#xff08;16字节&#xff09;的散列值&#xff08;hash value&#xff09;&#xff0c;用于确保信息传输完整一致。 每一个文件都会生成…