html5入门到精通(三)—移动设备的html5页面布局
html5吧
全部回复
仅看楼主
level 8
残风影儿 楼主
我们结合移动设备(手机和平板电脑)的特性,介绍HTML5中新增的语义化标签元素,以及在移动Web浏览器下Web页面布局的知识及例子。
HTML5标准添加的新元素当中,用于标识常见页面结构的包括:section、header、footer、nav、article和mark等。
2019年05月04日 10点05分 1
level 8
残风影儿 楼主
header
元素定义文档的页面组合,通常是一些引导和导航信息。而定义中说明
标签内通常包含section的头部信息,如hl-h6或hgroup等,但这不是必需的。同时也可以包含列表、搜索框或主题相关的Logo。如下代码所示:
2019年05月04日 10点05分 2
level 8
残风影儿 楼主
需要注意的是,一个HTNfL页面上可以允许有一个或多个header和footer。
在footer标签内,不仅可以包含p标签等相关内容,同时也可以插入比如nav、ul、div等其他元素。因此需要根据实际情况而布局页面。从上述代码可以看出,虽然footer标签的内容插入了部分版权信息及相关的联系信息,但并不是带含义的内容,下面将介绍nav元素,它可以帮助此部分含有语义内容。
nav
元素定义为用来构建导航,显示导航链接。nav标签的主要作用是放入一些当前页面的主要导航链接,例如在页脚显示一个站点的导航链接。我们将刚才footer标签的实例代码稍微更改一下,以表达导航语义的性质,如下代码所示:
2019年05月04日 10点05分 3
level 7
学知识
2019年05月04日 13点05分 4
level 8
好好学习天天向上
2019年05月04日 13点05分 5
level 15
学到了,谢谢楼主
2019年05月05日 11点05分 6
level 12
html5,我喜欢
2019年05月05日 12点05分 7
level 9
好复杂
2019年05月05日 13点05分 8
level 7
来学习了
2019年05月05日 13点05分 9
level 11
移动端浏览,会有影响那你
2019年05月05日 13点05分 10
level 8
学习了
2019年05月05日 14点05分 11
level 9
好复杂呀,什么都看不懂
2019年05月05日 17点05分 12
level 4
学到老活到老
2019年05月06日 12点05分 13
level 15
跟着楼主学到了很多
2019年05月06日 14点05分 14
level 8
很详细的教程
2019年05月06日 14点05分 15
1 2 3 尾页