Html5(2)新增的结构元素 及 新增页面元素

本文介绍了HTML5中新增的主体结构元素和非主体结构元素,包括figure、figcaption、detail、summary、mark、progress、meter等,并详细讲解了它们的用途和示例。同时,也探讨了改良的ol、dl列表元素以及cite和small元素的用法变化。

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


新增的主体结构元素

①article 元素  //描述独立完整的文档,如博客、帖子、评论;可以嵌套使用;可以作为插件使用
②section 元素  //用来划分区域,常由标题和内容构成;不同于div,如果需要被脚本操作,通常选择div而非section
③nav 元素     //传统导航、侧边导航、页内导航、翻页导航
④aside 元素   //附属信息部分,如侧边栏、广告等等与主内容分开的部分time 元素    //包含datetime、pubdate(发布时间)属性 ; 属于微格式

新增非主体结构元素

header 元素  //通常是引导 和 导航作用,可以不止一个,一个页面单独的整体也可以含有header
②footer 元素  //一般作为脚注,如作者、版权信息等等
③hgroup 元素   //将标题及子标题作为一个组
③adress 元素  //呈现文档中的 联系信息,如作者、邮箱、地址等等

新增的页面元素:

①figure、figcaption元素:用于页面的一个独立部分,可以放图片/视频/表格等。去掉不影响页面,figcaption是figure元素内的标题
②detail、summary元素:detail是可展开的部分,包含值为boolean类型的open属性,表示是否展开;detail包含summary元素,
用来单击展开detail;可以做折叠表单;举例:如图
detail元素
③mark元素:着重文字,如

`<mark>这部分文字会出现黄色背景</mark>`

④progress元素:用来表示某个工作的完成进度条
⑤meter元素:显示的规定范围内的比例;比如投票比例、技能等级等等


改良的页面元素:

①ol列表元素:添加了start 和 reversed 属性;start用于指定标注的开始;reversed表示倒序
②dl列表元素:表示列表项,内部包含dt和dd元素,不允许重复
③严格限制的cite元素 及 重新定义的small元素:cite元素内的文字会变斜体,small元素需要使用样式才使字体变小

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值