H5笔记 | HTML5语义元素

最新推荐文章于 2022-03-03 21:32:09 发布

变量鼓手

最新推荐文章于 2022-03-03 21:32:09 发布

阅读量280

点赞数 1

文章标签： HTML5

本文链接：https://blog.youkuaiyun.com/weixin_44290930/article/details/85638807

版权

本文详细介绍了HTML5中的语义元素，如header、nav、section等，这些元素不仅提升了网页的可读性和结构清晰度，还为开发者提供了更丰富的布局选择。文章通过实例对比了语义元素与无语义元素的区别，强调了语义元素在现代网页设计中的重要性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

仅做笔记分享，如有错误请高手指出

1.语义元素

一个语义元素能够清楚的描述其意义给浏览器和开发者。

无语义元素实例:

和 - 无需考虑内容.

语义元素实例: ,

, and - 清楚的定义了它的内容.

2.HTML5中的新语义元素

HTML5标签	web部分
header	头部区域
nav	导航栏
section	内容块
aside	侧边栏
figcation	定义 figure 元素的标题
figure	规定独立的流内容
footer	底部区域

在这里插入图片描述

【高手笔记】
Html5中的＜section＞标签的介绍
https://blog.youkuaiyun.com/whaxrl/article/details/22053305
HTML5中figure和figcaption标签用法
https://blog.youkuaiyun.com/namechenfl/article/details/82978952

参考资料：HTML5 语义元素

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

变量鼓手

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

HTML5 语义化元素

很酷的站长的博客

02-03

687

本文我们要来介绍一个抽象的知识点-语义化。什么是语义化，浅显的来说就是使用来实现相应的功能，这里说的合适并非是从性能、数据结构、算法等深度层面，而是从阅读和维护方式等层面。编程过程中实现一个相同的功能，往往可以使用多种不同的方式，选择一个合适的方式需要综合考虑可维护性、扩展性、性能等几种不同的维度，而可维护性是其中比较重要的一个因素。可维护性就是指书写的代码是否通俗易懂方便阅读，当大家都遵守一种统一的书写标准时，团队的开发效率、协调能力就能得到很大的提升。

html5 语义化标签实用指南

最新发布

weixin_40348267的博客

04-24

743

以上就是 HTML5 中语义化标签的内容，这些内容在面试中也可能被问到，在平时写页面时留意下每个标签对应的含义，用在正确的位置才能发挥语义化标签最大的作用。：<figure> 用于表示独立的内容块，如图片、图表、代码示例等，而 <figcaption> 用于为这些内容块添加标题或说明。：表示导航部分，用于包含页面的主要导航链接。：表示一个独立的区块，可以包含一组相关的内容。：表示页面的侧边内容，通常是与页面主要内容相关但可以独立存在的内容。，希望大家在学习的过程中养成做笔记的习惯，形成自己的知识体系。

参与评论您还未登录，请先登录后发表或查看评论

HTML5 语义元素

weixin_34254823的博客

01-07

131

2019独角兽企业重金招聘Python工程师标准>>> ...

HTML 四十六 HTML5 语义

W_H_M_2018的博客

09-19

1096

语义学（源自古希腊）可定义为对语言意义的研究。语义元素是拥有语义的元素。什么是语义元素？语义元素清楚地向浏览器和开发者描述其意义。非语义元素的例子：<div> 和 <span> - 无法提供关于其内容的信息。语义元素的例子：<form>、<table> 以及 <img> - 清晰地定义其内容。浏览器支持此外，您可以“帮助”老式浏览器处理“未知元素”。所有现代浏览器均支持 HTML5 语义元素。在 HTML5 浏览器

HTML5语义元素

gloria_chenjing的博客

11-01

761

1、什么是语义元素？语义元素清楚的向浏览器和开发者描述其意义例如：非语义元素： 2、HTML5提供新的语义元素（1）section元素定义文档中的节节：有主题的内容组通常具有标题将网站首页划分为简介内容联系信息（2）article 元素规定独自的包含内容文档有其自身的意义并且独立于其他内容进行阅读应用场景：论坛博客新闻在因特

H5笔记1

08-08

- **语义化标签**：HTML5引入了如, , , , 等语义化标签，使页面结构更加清晰，便于搜索引擎理解和用户理解。 - **多媒体支持**：内建对音频和视频的支持，无需额外插件即可播放多媒体内容，如和标签。 - **离线...

h5前端学习笔记

03-21

2. **html 代码片段库**：HTML5的元素和属性可能被分类整理，包括新引入的语义化元素如、、等，以及媒体元素如、，还有表单控件的增强等。 3. **javascript 代码片段库**：JavaScript作为前端的主要脚本语言，可能...

H5笔记.zip

02-14

【H5笔记.zip】是一个包含了多个与HTML5相关的学习资源的压缩包，涵盖了从基础到高级的多个方面。以下是对每个文件内容的详细说明： 1. **js笔记.7z**：这可能是一个关于JavaScript编程的笔记集合，JavaScript是...

HTML5笔记.docx

07-08

1. **新元素的引入**：HTML5引入了许多新的语义元素，如、、、、等，这些元素帮助开发者更好地结构化内容，提高页面的可读性和可访问性。 2. **<!DOCTYPE>声明**：在HTML5中，<!DOCTYPE>声明变得更简单，只需写成`...

【HTML】H5中的语义元素

yy_bazinga的博客

03-03

494

语义元素语义元素header元素main元素footer元素nav元素aside元素article元素section元素说明语义元素语义= 意义语义元素 = 有意义的元素什么是语义元素? 一个语义元素能够清楚的描述其意义给浏览器和开发者。无语义元素实例（无需考虑内容）: <div> 和 <span> ；语义元素实例（清楚的定义了它的内容）: <form>、<table>、<img>。 header元素 header元素可以表示网页的头部

HTML5中新的语义元素

前端小白菜

07-23

420

header、footer、nav等

浅谈HTML5新语义元素

命运の我手中的博客

11-26

339

可以使用HTML5的一些新语义元素来定义内容，包括<mark>、<meter>、<progress>和<time> <mark>元素用来标记用作参考的高亮文本，在使用搜索引擎时，此类文本总是会出现，搜索的关键字在搜索结果中以高亮显示（通常为粗体），与<strong>和<em>元素不同，<mark&am

HTML5之语义元素

kailimanong的博客

04-03

174

《section》用于定义文档的章节。如：《body》《section》《h1》哥只是个传说《/h1》《p》好样的《/p》《/section》《/body》《article》独立的内容如：《body》《article》《h1》大华《/h1》《p》为人民服务《/p》《/article》《/body》《nav》定义连接的部分。如：《body》《nav》《a...

H5前端开发学习笔记：代码片段及技术深度解析

本篇学习笔记将围绕H5前端开发的核心知识点进行总结，帮助你更好地理解和掌握前端技术。 ### HTML HTML（HyperText Markup Language）是构成网页内容的骨架，它定义了网页的结构。一个基本的HTML文件包括`<!...