详解HTML5网页结构
HTML5的网页结构
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<header>...</header>
<nav>...</nav>
<article>...</article>
<section>...</section>
<aside>...</aside>
<footer>...</footer>
</body>
</html>
DOCTYPE声明
HTML4中的DOCTYPE声明格式如下图：
HTML5中的DOCTYPE声明格式如下图：
Head
HTML完了之后就是Head部分，head表示的就是不在浏览器内容的正文显示部分显示。Head里面有个meta标签，里面有个charset属性，值是UTF-8，这是表示网页的字符编码。
在HTML4中的格式：
在HTML5中的格式：
Title表示网页的名称，会现在是浏览器的窗口之上。
body
Head部分完成之后，就是我们的body部分，body里面的内容都会在浏览器的窗口内显示，也就是我们的主体部分，我们平常所看到的部分。
Header标签
是HTML5之后新增的元素，header元素表示页面中的一个内容区块或者整个页面的标题！
HTML5中使用方法：
<header></header>是一对的形式展示，有头有尾。
<nav>元素
<nav>元素也是新增的元素，nav元素表示页面中的导航链接部分。
HTML5中使用方法：
<nav>...</nav>
<article>元素
article元素表示页面中的一块玉上下文不相关的的独立内容，比如一篇文章中的文章。
HTML5的使用方法：
<article></article>
<section>元素
cection表示页面中的一块内容区块，比如章节的页眉、页脚等等。也可以和Hn（h1、h2..)等一起使用，标示出文档的结构！
<section></section>
<aside>元素
aside元素表示article元素的内容之外的，和内容相关的辅助信息！
<aside><aside>
<footer>元素
footer表示页面或者是页面中的一块区域的页脚，比如存放文件的创建时间、作者、联系方式等等。
<footer></footer>
转载于:https://www.cnblogs.com/bdqnit/p/9091078.html
详解HTML5网页结构相关推荐
- html5录音兼容性,详解HTML5 录音遇到的坑
本文恩主要介绍了详解HTML5 录音的踩坑之旅,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧,希望能帮助到大家. 说实话,一开始都没接触过 HTML5 的 Audio A ...
- html5录音怎么保存到本地,详解HTML5 录音遇到的坑
本文恩主要介绍了详解HTML5 录音的踩坑之旅,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧,希望能帮助到大家. 说实话,一开始都没接触过 HTML5 的 Audio A ...
- HTML中的camera标签,详解HTML5 使用video标签实现选择摄像头功能
详解HTML5 使用video标签实现选择摄像头功能 1. html // jquery reference // // Open WebCam Snap Photo 2. javascript El ...
- html5 摄像头 直播,详解HTML5 使用video标签实现选择摄像头功能
详解HTML5 使用video标签实现选择摄像头功能 1. html // jquery reference // // Open WebCam Snap Photo 2. javascript El ...
- popstate_详解HTML5之pushstate、popstate操作history,无刷新改变当前url
一.认识window.history window.history表示window对象的历史记录,是由用户主动产生,并且接受javascript脚本控制的全局对象.window对象通过history对 ...
- 详解10G以太网结构、PMD接口及应用的相关知识
详解10G以太网结构.PMD接口及应用的相关知识 现在10Gbps的以太网标准已经由IEEE 802.3工作组于2000年正式制定,10G以太网仍使用与以往10Mbps和100Mbps以太网相同的形式 ...
- 视频教程-HTML5+CSS3项目实战详解-HTML5/CSS
HTML5+CSS3项目实战详解 13年软件开发经验,设计开发30多个大型软件,涉及政府.银行.电信.能源等大型软件项目. 精通J2EE体系架构,熟练使用Struts.Spring.hibernate ...
- html语言中,amp;amp;用来表示,详解HTML5中的amp;amp;lt;templateamp;amp;gt;标签
标签,是HTML5入门中的重要知识,需要的朋友可以参考下 一.HTML5 template元素初面2PpHTML5中文学习网 - HTML5先行者学习网 元素,基本上可以确定是2013年才出现的.干嘛 ...
- DDR3内存详解，存储器结构+时序+初始化过程
转载 DDR3内存详解,存储器结构+时序+初始化过程 2017-06-17 16:10:33 a_chinese_man 阅读数 23423更多 分类专栏: 硬件开发基础 转自:http://www. ...
最新文章
- Jmeter之解决烦人的中文乱码问题
- mysql 1243_MySQL#1243给予EXECUTE的未知预处理语句处理程序(stmt)
- （Java常用类）日期时间类
- 信息学奥赛一本通（2020：【例4.5】第几项）
- Obstacle-- last interrupt reason
- 服务器系统是选择CentOS，还是选择Ubuntu
- SQL SERVER 备份数据库到指定路径语句
- 阿里云POLARDB 2.0重磅来袭！为何用户如此的期待？
- 黑苹果 macos 教程
- 常用的数据挖掘建模工具
- 路飞学院 python_路飞学院-Python爬虫实战密训班-第1章
- 爱酱，鹿鸣？！自己怎么做一个虚拟二次元偶像？
- Python图片批量自动抠图去背景
- Cocos Creator下JavaScript实现口红机，附代码
- 微信图片服务器逻辑,微信小程序[第八篇] -- 实现完整的相册列表逻辑（小程序端服务器端）...
- ava.util.ConcurrentModificationException 异常
- JavaScript中的闭包原理
- 一个“鸡血班”毕业生的自述
- BuildDownload maven-metadata.xml...打包一直卡在这里
- 联想台式计算机出厂号在哪里,联想电脑怎么查看主机编号_联想电脑编号在哪里【图】...