移动设备HTML5页面布局
在HTML5标准添加的新元素中，用于常见页面结 构的包括header footer footer nav aside aside article section hgroup 。
下面简单介绍一下这个元素：
1.header
header>元素定义文档的页面组合，通 常是一些引导和导航信息，标签内通常包含 secti- on的头部信息，如h1~h6 或 hgroup等。
<header>
<h1>HTML5布局学习</h1>
<P>勤学苦练</p>
</header>
与下面的代码是一致的：
<div class=”header”>
<h1>HTML5布局学习</h1>
<P>勤学苦练</p>
</div>
2.footer
<footer>元素定义文档或章节的末尾部分 包含一些章节的基本信息，如作者信息，相关连 及版权信息。 一个页面上可以使用多个 header 和footer,也可以插入一些别的元素，比如div ul 等。
<footer>
<p>隐私信息</p>
<p>关于我们</p>
</footer>
3.nav
<nav>元素用于定义构建导航，显示导航 链接，用于放入一些当前页面的主要导航链接。
<footer>
<nav>
<ul>
<li>隐私信息</li>
<li>版权信息</li>
<li>关于我们</li>
<li>联系我们</li>
</ul>
</nav>
</footer>
4.aside
<aside>元素用于定义一个页面的区域， 用来表示包含页面相关的主要内容，用于装载非 正文的主要内容，如广告栏，侧边栏等。
5.article
<article>元素表示文档，页面，用来显示一块独立的文章内容，如一则网站新闻，一偏博客文章等。
<article>
<header>
<h1>HTML5新元素</h1>
<p>article 新元素</p>
<footer>
<ul>
<li>文章标签1</li>
<li>文章标签2</li>
</ul>
</footer>
</header>
</article>
6.section
<section>元素第一位文章中的节，比如章节，页眉，页脚。
<article>
<section>
<h1></h1>
<p></p>
</section>
<section>
<h1></h1>
<p></p>
</section>
</article>
7.hgroup
<hgroup>定义为对网页或区段的标题元素进行组合，通常使用多级别的h1~h6标签节点进行分组。
<header>
<hgroup>
<h1></h1>
<h2></h2>
</hgroup>
</header>
更多专业前端知识，请上 【猿2048】www.mk2048.com
移动设备HTML5页面布局相关推荐
- html5 移动页面,html5入门到精通，移动设备的html5页面布局
移动设备的html5页面布局 我们结合移动设备(手机和平板电脑)的特性,介绍HTML5中新增的语义化标签元素,以及在移动Web浏览器下Web页面布局的知识及例子. HTML5标准添加的新元素当中,用于 ...
- html5页面整体布局,HTML5页面布局 网页的基本结构
这篇HTML5页面布局我们来学习组成HTML5网页的基本结构都包含了哪些内容,首先先来看下源代码. 欢迎关注头条号/自学编程 hello world 以上就是一个HTML5网页的最基本结构. 下面我们 ...
- HTML5页面布局基础
声明:本人的所有博客皆为个人笔记,作为个人知识索引使用,因此在叙述上存在逻辑不通顺.跨度大等问题,希望理解.分享出来仅供大家学习翻阅,若有错误希望指出,感谢! 区块标签(sections) 区块标签和 ...
- 【初探移动前端开发02】移动设备的页面
前言 上午时候我们简单了解了下用互联网的发展,本来想继续,却被打断了,所以我们现在继续学习吧. 移动设备的页面布局 我们前面一起学习了HTML5新增的很多语义化标签,不知各位还记得吗?这里我们可能需要 ...
- html5 移动端单页面布局
序 移动端的web网页使用的是响应式设计,但一般我们看到的网站页面都是跳转刷新得到的,比如通过点击一个menu后进入到另一个页面 今天来说下是移动端的单页面的布局.单页面就是一切操作和布局都 ...
- 一个html5页面,html5做一个黑板报页面
html5做一个黑板报页面 我们结合移动设备(手机和平板电脑)的特性,介绍HTML5中新增的语义化标签元素,以及在移动Web浏览器下Web页面布局的知识及例子. 在HTML5标准添加的新元素中,用于常 ...
- vue移动端html5页面根据屏幕适配的四种解决方法
最近做了两个关于h5页面对接公众号的项目,不得不提打开微信浏览器内置地图导航的功能确实有点恶心.下次想起来了的话,进行总结分享一下如何处理.在vue移动端h5页面当中,其中适配是经常会遇到的问题,这块 ...
- 微信HTML5页面设计建议
一个HTML5页面从提出到完成上线的流程:> 1.需求方.设计人员.H5实现人员三方共同讨论实现方案 2.设计人员出设计图 3.H5人员按设计图出H5页面 4.需求方评估已实现的H5页面后给予反 ...
- 苹果状态栏HTML,有关HTML5页面在iPhoneX适配问题
1. iPhoneX的介绍 屏幕尺寸 我们熟知的iPhone系列开发尺寸概要如下: △ iPhone各机型的开发尺寸 转化成我们熟知的像素尺寸: △ 每个机型的多维度尺寸 倍图其实就是像素尺寸和开 ...
最新文章
- lua打开是二进制代码_物联网的构建：使用Lua高级语言进行嵌入式开发
- DWR推送的一些随笔
- 升级到BigSur无法使用git和brew解决办法
- EF5.x Code First 一对多关联条件查询,Contains,Any,All
- 统计表达式二叉树操作数个数
- 8. GD32F103C8T6 定时器-输入捕获测频率
- java 正则 惰性匹配_正则表达式 - 贪婪与非贪婪（惰性）
- 中兴V889D刷机变砖不用怕 V889D救砖教程发布【转载】
- Docker入门之安装MySQL
- 萤石云平台接入_新手上路 老司机教你配置萤石云
- 怎么把外部参照合并到图纸_为什么CAD图纸作为外部参照插入时位置变了？
- 使用PHP编写的基于MySQL博客模板-可直接使用
- c语言课程设计作业医院挂号系统,c语言课程设计机房机位预定系统绝对正确,附源代码...
- 成都梵羽汇：抖音任务中心如何操作呢?
- 找文心一言问了几个嵌入式软件开发的问题
- 惊！搜狐邮箱乱添附件！！！！
- 同行动态：海隆软件96%销售额来自出口
- Twitter全球宕机数次，马斯克说后端更换架构，重新上线
- 芯片突围指望BAT，能成吗？
- 支持向量机中的详细公式推导
热门文章
- 土地利用覆被变化的概念_欠压实概念极其荒谬
- matlab在电磁场与电磁波中的应用,matlab在电磁场与电磁波学习中的应用.docx
- soapui 证书_SoapUI入门之附件上传和配置Https请求
- mysql插入另一个表中数据_MySql中把一个表的数据插入到另一个表中的实现
- java.jsp.jdbc_Java-jsp使用JDBC访问数据库时显示乱码是怎么回事？
- 7个相同小球4个不同盒子_【计算启蒙】4个游戏陪娃玩懂“数拆分”，加减法都不用愁！...
- yandexbot ip列表整理做俄罗斯市场的站长可以关注一下
- 数据结构（六）查找---多路查找树（2-3-4树）
- java获取类名不包括路径
- 1003 阶乘后面0的数量