Html5新增的语义化标签(部分)
2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成。这是互联网的一次重大变革,这也许是一个时代的来临!
总结一些h5新增的语义化标签,记录下来方便自己学习及使用:
1、<header></header> 页眉:主要用于页面的头部的信息介绍,也可用于板块头部;
2、<hgroup></hgroup> 页面上的一个标题组合:一个标题和一个子标题,或者标语的组合;
3、<nav></nav> 导航:包含链接的一个列表;
4、<section> <section> 页面上的版块:用于划分页面上的不同区域,或者划分文章里不同的节;
5、<article></ article > 用来在页面中表示一套结构完整且独立的内容部分:可以用来呈现论坛的一个帖子,杂志或报纸中的一篇文章,一篇博客,用户提交的评论内容,可互动的页面模块挂件等;
6、<aside></ aside> 元素标签可以包含与当前页面或主要内容相关的引用、侧边栏、广告、nav元素组,以及其他类似的有别与主要内容的部分:①aside 的内容应该与 article 的内容相关,② 被包含在<article>中作为主要内容的附属信息部分,其中的内容 以是与当前文章有关的引用、词汇列表等,③在<article>之外使用,作为页面或站点全局的附属信息部分;最典型的形式是侧边栏(sidebar),其中的内容可以是友情链接、附属导航或广告单元等;
7、<figure> < figure > 用于对元素进行组合:一般用于图片或视频;
8、<figcaption> <figcaption> figure的子元素:用于对figure的内容 进行说明;
9、<time></time>用来表现时间或日期;
10、<datalist></datalist>选项列表:与 input 元素配合使用,来定义 input 可能的值;
11、<details></details>用于描述文档或文档某个部分的细节:①该元素用于摘录引用等,应该与页面的主要内容区分开的其他内容,②Open属性默认展开;
12、< summary></summary> details 元素的标题;
13、<dialog></dialog>定义一段对话;
14、<address></address> 定义文章或页面作者的详细联系信息;
15、<mark></mark> 需要标记的词或句子;
16、<keygen>给表单添加一个公钥;
17、<progress><progress>定义进度条;
18、<footer></footer>页脚:页面的底部或者版块底部。
Html5新增的语义化标签(部分)的更多相关文章
- html5新增的语义化标签极其作用
在html5中,新增了几个语义化标签:<article>.<section>.<aside>.<hgroup>. <header>,< ...
- HTML5学习之语义化标签(一)
一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...
- HTML5学习之语义化标签
一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...
- 从零开始学 Web 之 HTML5(一)HTML5概述,语义化标签
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- HTML新增的语义化标签及其作用
在html5中,新增了几个语义化标签:<article>.<section>.<aside>.<hgroup>. <header>,< ...
- HTML5常用的语义化标签
快速查询 article | aside | nav | section | header | footer 架构预览 nav 定义导航链接的部分 在页脚显示一个站点的导航链接,如首页.服务信息页面. ...
- [HTML知识体系]语义化标签概论
1.什么是语义化 语义化(Semantic)在HTML5中被大量提起,就是语义化标签向浏览器和开发者展示了它所包裹内容的类型与意思,可是至今我看了好多代码,HTML5新增的语义化标签的使用率还是挺低的 ...
- HTML5语义化标签重构页面
在HTML5未出现之前我们都用div+css来构建页面,比如<div id=”header”>,div的滥用,使得代码的可读性和可维护性很差,现在用本文来介绍一下用HTML5′干净的’语义 ...
- 第二季第十一天 html5语义化标签 css透明度
span不能设置宽高背景 HTML5语义化标签 <section>标签所包裹的是有一组相似的主题的内容,可以用这个标签来实现文章的章节.标签式对话框中的各种标签页等类似的功能. <s ...
随机推荐
- zoj 3841 Cards
题意:给你52张牌,已知一个牌的序列,然后利用剩余的牌,能排成多少个序列,这个序列比已知的序列字典序小. 思路:从左到右尽可能放比已知序列相应位置小,找不到就放一样,然后求组合数就可以.多重集排列定理 ...
- 集群-Session解决方案
在集群中session安全和同步是个最大的问题,下面是收集到的几种session同步的方案,希望能通过分析其各自的优劣找出其适应的场景. 1. 客户端cookie加密 简单,高效.比较好的方法是自己采 ...
- [cocos2d]关于CCSprite的若干问题与误区
文章 [cocos2d] 利用texture atlases生成动画 中介绍了如何生成动画并绑定在CCSprite实例上. 使用该代码遇到了几个问题,值得mark下 问题1.多实例 问题描述: 新建一 ...
- HDFS文件系统基本文件命令、编程读写HDFS
基本文件命令: 格式为:hadoop fs -cmd <args> cmd的命名通常与unix对应的命令名相同.例如,文件列表命令: hadoop fs -ls 1.添加目录和文件 HDF ...
- 从 mian 函数开始一步一步分析 nginx 执行流程(一)
如不做特殊说明,本博客所使用的 nginx 源码版本是 1.0.14,[] 中是代码所在的文件! 我们先贴出 main 函数的部分代码: [core/nginx.c] int ngx_cdecl ma ...
- Welcome Back to C++ (Modern C++)
http://msdn.microsoft.com/en-us/library/hh279654.aspx 看看你是古代还是现代Cpper重点强调 Stack-based scope instead ...
- 1044 - Palindrome Partitioning(区间DP)
题目大意: 给你一个字符串,问这个字符串最少有多少个回文串. 区间DP直接搞 #include<cstdio> #include<cstring> #include&l ...
- gcc编译器参数使用及解决
gcc -c CStringAndPointer.c -o CStringAndPointer.o 执行时出现问题: ./CStringAndPointer.o bash: ./CStringAndP ...
- Difference Between Primes
Problem Description All you know Goldbach conjecture.That is to say, Every even integer greater than ...
- (转载)sinaeditor漏洞
SinaEditor简介 SinaEditor是基于新浪博客编辑器的开源编辑器.您可以用它来编辑富文本内容. 编辑器的核心是一个执行队列的调度系统,加入插件来实现功能,并通过事件来驱动编辑器的运行.我 ...