html5新增语义化标签
注意:body、section、nav 需要h1-h6.
div、header则不需要。
1):<article> 显示一个独立的文章内容。
例如一篇完整的论坛帖子,一则网站新闻,一篇博客文章等等,一个用户评论等等。artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系。
例如,一个博客文章,可以用article显示,然后一 些评论可以以article的形式嵌入其中。
<article>
<h1>文章标题</h1>
这是一篇文章
<article>评论1...</article>
<article>评论2...</article>
</article>
2):<section> 定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。必须包含有h1-h5.
实例:
<section>
<h1>章节一</h1>
<p>详细内容...</p>
</section>
3):<aside> 用来装载非正文类的内容。例如广告,成组的链接,侧边栏等等。
4):<hgroup> 用于对网页或区段的标题元素(h1-h6)进行组合。
例如,在一个区段中你有连续的h系列的标签元素,则可以用hgroup将他们括起来。
<hgroup>
<h1>标题1</h1>
<h2>标题2</h2>
</hgroup>
5):<header> 定义文档的页面组合,通常是一些引导和导航信息。
6):<footer> 定义 section 或 document 的页脚。
在典型情况下,该元素会包含创作者的姓名、文档的创作日期以及/或者联系信息。
实例:
<footer> © 2012 Baidu 使用百度前必读 京ICP证030173号 </footer>
7):<nav> 导航链接放在nav标签里。
nav标签里应该放入一些当前页面的主要导航链接。
例如在页脚显示一个站点的导航链接(如首页,服务信息页面,版权信息页面等等),就可以使用nav标签,当然,这不是必须的。
8):<time> 定义公历的时间(24 小时制)或日期,时间和时区偏移是可选的。
该元素能够以机器可读的方式对日期和时间进行编码,搜索引擎也能够生成更智能的搜索结果
9):<mark>定义带有记号的文本。请在需要突出显示文本时使用 <mark> 标签。
10):<figure>规定独立的流内容(图像、图表、照片、代码等等)。
figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。
11):<figcaption> 定义 figure 元素的标题(caption)。
"figcaption" 元素应该被置于 "figure" 元素的第一个或最后一个子元素的位置。
实例:
<figure> <figcaption>美女图片</figcaption>
<img src="meizi.jpg" width="350" height="234" />
</figure>
html5新增语义化标签的更多相关文章
- 浅谈html语义化标签,Html5新增语义化标签
Html语义化标签,Html5新增语义化标签 自己在学习的期间,整理了下html关于语义化标签的一些知识,列的不是很全. 希望大家有新的见解可以给我留言,我会补充上去,谢谢大家 1.什么是语义化标签? ...
- html5手册语义化标签
html5手册语义化标签: article section aside hgroup header footer nav time mark figure figcaption contextmenu ...
- HTML5之语义化标签
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...
- HTML5 部分新增语义化标签元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5新增语义化标签
一.根据页面的结构,由div派生的标签. <header> <footer> <nav> 导航 在H4中导航栏一般用ul-li标签,H5中可以直接用<nav& ...
- 从零开始学 Web 之 HTML5(一)HTML5概述,语义化标签
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- Html5新增的语义化标签(部分)
2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成.这是互联网的一次重大变革,这也许是一个时代的来临! 总结一些h5新增的语义化标签,记录下来方便自己学习 ...
- html5新增的语义化标签极其作用
在html5中,新增了几个语义化标签:<article>.<section>.<aside>.<hgroup>. <header>,< ...
- html5 新增语义标签
一份模板: <body> <header> <hgroup> <h1>Page title</h1> <h2>Page subt ...
随机推荐
- Java中Collections和Collection的区别
java.util.Collection Collection 层次结构 中的根接口.Collection 表示一组对象,这些对象也称为 collection 的元素.一些 collection 允许 ...
- DBCC SHRINKFILE收缩日志/收缩数据库/收缩文件
DBCC SHRINKFILE 收缩相关数据库的指定数据文件或日志文件大小. 语法 DBCC SHRINKFILE ( { file_name | file_id } { [ ,t ...
- Ubuntu Linux下通过代理(proxy)使用git上github.com
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/loveaborn/article/details/24575659 github.com.作为程序猿 ...
- tensorflow 中 name_scope 及 variable_scope 的异同
Let's begin by a short introduction to variable sharing. It is a mechanism in TensorFlow that allows ...
- (转)RTP-H264封包分析
rtp(H264)第一个包(单一NAL单元模式)————-sps 80 {V=10,p=0,x=0,cc=0000} 60 {m=0,pt=110 0000} 53 70{sequence numbe ...
- 知乎Live总结-重复nature文章笔记Single-cell
来自知乎Live-孟浩巍 1.文章重要技术及图讲解 首先在转录组RNA-seq中,有基因表达差异.基因融合.可变剪切.RNA单点突变. 在基因组中,单点变异.结构变异,CNV变异(拷贝数变异) 三类基 ...
- Jupyter Notebook修改目标文件
默认的路径 如果没有修改配置文件,那么一般就在用户目录下面: 下面各处默认起始目标地址,以防有一天想改回来 I:\shujufenxi\python.exe I:\shujufenxi\cwp.py ...
- mysql 系列文章推荐
1. mysql日志详细解析 http://www.cnblogs.com/wangkongming/p/3684950.html 2. mysql 主从同步实验 http://pmg ...
- ASP.NET MVC 在项目中使用面包屑导航
给框架添加一个面包屑导航 1.创建一个类 using System; using System.Collections.Generic; using System.Linq; using System ...
- 苹果Dock样式的菜单
在线演示 本地下载