HTML5新增的主体元素article、section、nav、aside、time元素和pubdate属性
article
artticle元素代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。它可以是一篇博客或者报刊中的文章,一篇论坛帖子,一段用户评论或者独立的插件或其他任何独立的内容。
article元素是可以嵌套的。
article元素可以用来表示插件。
section
section元素用于对网站或应用程序中页面上的内容进行分块。一个section元素经常由内容及其标题组成。但section元素并非一个普通的容器元素;当一个容器需要被直接定义样式或通过脚本定义行为时,推荐使用div而非section元素。
article是特殊类的section元素,所以两元素可以互换,只是article比section更加强调独立性。section元素强调分段或分块。如果内容分段后比较独立,就可以使用article元素。
注意: 1.不要将section元素作为设置样式的页面容器。
2.如果artcle元素、aside元素、nav元素更符合使用条件,那就不要使用section元素
3.没有标题内容 不要使用section元素
nav
nav元素是一个可以用作页面导航的链接组,其中的导航元素链接到其他页面或当前页面的其他部分。并不是所有的链接组都要被放进nav元素,只需要将主要的、基本的链接组放进nav元素即可。
nav元素应用场景:
*传统导航条
*侧边栏导航
*页内导航
*翻页操作
注意:html5中不能使用menu元素代替nav元素(——menu元素是使用在一系列发出命令的菜单上的,是一种交互性的元素,使用在web应用程序中的)
aside
aside元素用来表示当前页面或文章的附属信息部分,它可以包含与当前页面或主要内容相关的引用、侧边栏、广告、导航条,以及其他类似的有区别于主要内容的部分
time
pubdate
HTML5新增的主体元素article、section、nav、aside、time元素和pubdate属性的更多相关文章
- HTML5新增的主体元素和新增的非主体结构元素
HTML5新增的主体元素 article元素 article元素表示文档.页面或应用程序中独立的.完整的.可以独自被外部引用的内容.它可以是一篇博客或者报刊中的文章,一篇论坛帖子.一段用户评论或独立的 ...
- 盒子模型,定位技术,负边距,html5 新增标签
盒子模型 /*[margin 外边距] margin属性最多四个 1.只写一个值,四个方向的margin均为这个值 2.写两个值:上,右两个方向,下默认=上,右 默认=左 3.写三个值:上.右.下三个 ...
- web前端学习(二)html学习笔记部分(1) -- html5新增的元素及特性等等
检查,在浏览器中可以调整设备类型 html5实现水池效果. lang:en为英文语言,中文语言zh <html lang="en"> <head> < ...
- html5新增操作类名方式 classList
如果一个元素有多个类名,要如何删除呢,jqeury提供了removeClass()这个api,如果不用插件,自己封装,可以这样 function removeClass(elm,removeClass ...
- html5新特性-header,nav,footer,aside,article,section等各元素的详解
Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性.级块性元素.行内语义性元素和交互性元素四大类. 下面是对各标签的详解,section.he ...
- HTML5新增及移除的元素
HTML经过10多年的发展,其元素经历了废弃与不断重新定义的过程.为了更好的处理现在的互联网应用,HTML5新增了图形绘制.多媒体播放.页面结构.应用程序存储.网络工作等新元素.http://hove ...
- 【原】HTML5 新增的结构元素——能用并不代表对了
做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.html ...
- HTML5新增标签及具体用法
html5自从推广普及以来,迅速被各大浏览器支持.采用html5设计的网页逐渐成为网页设计的时尚.下面就温习下html5的新增标签. HTML 5 中的新特性包括了嵌入音频.视频和图形的功能,客户端数 ...
- HTML5新增的属性
关于html5新增的属性: HTML5现在已经不是SGML的子集,主要是增加了关于图像,位置,存储,多任务等功能. 绘画CANVAS; 用于播放媒体的video和audio元素: 本地离线存储loca ...
随机推荐
- Python解释器的安装步骤
Python是一门强大的语言,目前已支持所有主流操作系统,在Linux,Unix,Mac系统上自带Python环境,在Windows10系统上需要安装一下,超简单 1. 打开官网 https://w ...
- useradd user 错误解决
今天给安装Sequoiadb 软体时,出现添加用户和组失败,显示错误: cannot lock /et/passwd; try again later. 在网上查了一下,说是/etc/passwd 文 ...
- 7天学完Java基础之5/7
接口 接口就是一种公共的规范标准 是一种引用数据类型 定义格式 public interface 接口名称{} java7 中接口可以包含常量,抽象方法:Java8 还可以额外包含默认方法,静态方法: ...
- C#拷贝整个文件夹以及子目录和其中文件
private void CopyDirectory(string srcPath, string desPath) { string folderNam ...
- web.xml中classpath*:与classpath:的区别
classpath对应src目录,该目录下的文件会在编译后被存放到WEB-INF文件夹下的classes目录. classpath:只会到你的class路径中查找配置文件,对于多个同名的配置文件,只会 ...
- Educational Codeforces Round 19 C
Description Petya recieved a gift of a string s with length up to 105 characters for his birthday. H ...
- Java 修改编码格式的几种方式
1.工作空间 workspase Window→Preferences→General→Workspace→Text file encoding→other→UTF-8 2.项目编码格式 右键项目名→ ...
- [已读]响应式web设计
去年冲着响应式这三个字买的,很快就读完了,因为说实话都挺浅显的内容.真正涉及到响应式的是第二和第三章(媒体查询 em 百分比图片),其他的h5与css3关系不大.
- 设计模式(3)-- 原型模式 (clone分析)
原型模式:用原型实例指定创建对象的种类,并且通过拷贝这些原型来创建对象. 在java中有语言级别的支持:clone 在java中使用原型模式是非常简单的事情,实现Cloneable接口,调用Objec ...
- Bloom Filter概念和原理【转】
Bloom Filter概念和原理 Bloom Filter是一种空间效率很高的随机数据结构,它利用位数组很简洁地表示一个集合,并能判断一个元素是否属于这个集合.Bloom Filter的这种高效是有 ...