三、HTML元素

一、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.mzph.cn/news/592854.shtml

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

相关文章

python算法问题,求两个字符串的最长公共子序列长度

对于问题&#xff0c;两个字符串的最长公共子序列长度进行求解&#xff0c;首先要知道子序列的定义&#xff0c;如果说给定一个字符串&#xff0c;对这个字符串中的原有字符进行不改变字符相对位置的删除&#xff0c;这里的相对位置就是处于前还是后的相对关系&#xff0c;进行…

[足式机器人]Part2 Dr. CAN学习笔记-自动控制原理Ch1-7Lead Compensator超前补偿器(调节根轨迹)

本文仅供学习使用 本文参考&#xff1a; B站&#xff1a;DR_CAN Dr. CAN学习笔记-自动控制原理Ch1-7Lead Compensator超前补偿器&#xff08;调节根轨迹&#xff09; 1. Plot Rootlocus 绘制根轨迹2. System Performance 系统表现3. 改善/加快收敛速度4. 超前补偿器 Lead Compe…

Vue3 结合typescript 组合式函数

在App.vue文件中 实现鼠标点击文件&#xff0c;显示坐标值 第一种方法 第二种方法&#xff1a;组合式函数 结果&#xff1a; 官网推荐组合函数&#xff1a;https://vueuse.org

MySQL之四大引擎、账号管理以及建库

目录 一.数据库存储引擎 ① MEMORY ②MyISAM ③InnoDB ④ARCHIVE 二.数据库管理 2.1.三大数据库 2.1.1.information_schema 2.1.2.mysql 2.1.3.performance_schema 2.2.相关操作 2.3.权限相关的表 三. 数据库的表管理 3.1.三大范式 3.2.基本数据类型 四.账号管理…

Arbitrum之后,估值18亿美元Scroll又火了

文章目录 Scroll的核心竞争力EVM等效全面的去中心化如何领取Scroll空投&#xff1f;结语参考 Scroll是用于以太坊的原生zkEVM Layer 2解决方案&#xff0c;帮助解决以太坊的拥堵问题并进行扩容。 Scroll创立于2021年&#xff0c;致力于创建一个 EVM&#xff08;以太坊虚拟机&a…

论文阅读: Semantics-guided Triplet Loss

ICCV 2021 Abstract 一个度量学习方法&#xff0c;通过浏览语义引导的局部集合去优化内在深度表示。一个新颖的特征融合模块能有效利用跨模态特异质特征。 Senantics-guided Triplet Loss 基本假设&#xff1a; 在场景语义分割图像中&#xff0c;目标内部相邻像素拥有同样…

声明式管理方法

声明式管理方法&#xff08;yaml&#xff09;文件&#xff1a; 1&#xff0c;适合对资源的修改操作 2&#xff0c;声明式管理依赖于yaml文件&#xff0c;所有的内容都在yamI文件当中 3&#xff0c;编辑好的yaml文件&#xff0c;还是要依靠陈述式命令发布到k8s集群当中 发布的…

数据损毁!250 亿美金的 Pinterest,在数据库选型上的翻车经历

原文链接 Pinterest 是一个以图片为主的社交网络&#xff0c;用户可以将图片保存或 "钉 / pin" 在自己的图板上。Pinterest 在 2019 年上市&#xff0c;目前市值 250 亿美金。本文内容主要根据 2012 年 Scaling Pinterest 的分享。 2012 年 1 月&#xff0c;Pinteres…

HTML----JavaScript操作对象BOM对象

文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 本章要求 了解BOM模型掌握BOM模型实际应用 一.BOM模型概述 BOM&#xff08;浏览器对象模型&#xff09;是JavaScript中的一个重要概念&#xff0c;它提供了一组用于控制浏览器窗口和页面内容的…

力扣热题100道-矩阵篇

矩阵 73.矩阵置零 给定一个 m x n 的矩阵&#xff0c;如果一个元素为 0 &#xff0c;则将其所在行和列的所有元素都设为 0 。请使用 原地 算法**。** 示例 1&#xff1a; 输入&#xff1a;matrix [[1,1,1],[1,0,1],[1,1,1]] 输出&#xff1a;[[1,0,1],[0,0,0],[1,0,1]]示例…

胡润研究院发布《2023胡润中国最具历史文化底蕴品牌榜》

胡润研究院发布《2023胡润中国最具历史文化底蕴品牌榜》&#xff0c;前十名分别是片仔癀、同仁堂、贵州茅台、五粮液、中国银行、中华、黄山、农业银行、建设银行、汾酒。 榜单调研范围涵盖中国内地具有60年以上历史的为消费者提供产品或服务的品牌&#xff0c;综合考察品牌历史…

C# 语法进阶 委托

1.委托 委托是一个引用类型&#xff0c;其实他是一个类&#xff0c;保存方法的指针 &#xff08;指针&#xff1a;保存一个变量的地址&#xff09;他指向一个方法&#xff0c;当我们调用委托的时候这个方法就立即被执行 关键字&#xff1a;delegate 运行结果&#xff1a; 思…

TikTok舞台背后:短视频如何打破艺术界界限?

TikTok&#xff0c;这个以短视频为媒介的平台&#xff0c;正成为全球年轻一代表达创意的重要舞台。然而&#xff0c;其影响不仅仅停留在娱乐领域&#xff0c;更在艺术界引起了巨大的关注。本文将深入探讨TikTok是如何在短视频的形式下打破传统艺术界的界限&#xff0c;为创作者…

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

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

【银行测试】超细支付功能测试+测试点总结分析(详全)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 1、支付功能怎么测…

PostgreSQL10数据库源码安装及plpython2u、uuid-ossp插件安装

PostgreSQL10数据库源码安装及plpython2u、uuid-ossp插件安装 1、环境2、安装包下载3、安装3.1 、解压3.2、配置3.3、编译安装3.4 、启动与关闭 4、安装 uuid-ossp 、plpython2u插件5、参考 1、环境 centos 7 、 postgresql 10.19 2、安装包下载 postgres 源码安装包 3、安…

golang学习专栏

GOLANG专栏 Golang基础教程 Golang基础教程 Golang练手算法 Golang练手算法 Golang设计模式 Golang设计模式 Golang数据结构和算法 Golang数据结构和算法 Golang并发编程 Golang并发编程 ORM框架Gorm Golang ORM框架gorm Golang源码分析 Golang源码分析 MySQL教程 MySQ…

Java 读取超大excel文件

注意&#xff1a;此参考解决方案只是针对xlsx格式的excel文件&#xff01; Maven <dependency><groupId>com.monitorjbl</groupId><artifactId>xlsx-streamer</artifactId><version>2.2.0</version> </dependency>读取方式1…

安装elasticsearch、kibana、IK分词器、扩展IK词典

安装elasticsearch、kibana、IK分词器、扩展IK词典 后面还会安装kibana&#xff0c;这个会提供可视化界面方面学习。 需要注意的是elasticsearch和kibana版本一定要一样&#xff01;&#xff01;&#xff01; 否则就像这样 elasticsearch 1、创建网络 因为我们还需要部署k…

java常用数据结构

List&#xff1a;ArrayList 和 LinkedList 1、ArrayList 和 LinkedList都是非线程安全 2、ArrayList 可以直接根据下表定位元素&#xff0c;查找速度快&#xff0c;但是修改元素慢&#xff1b;LinkedList 查找元素必须从第一个开始逐个查找&#xff0c;查找速度慢&#xf…