深入的探讨一下我对html5的了解和我的感悟 ,分享给小伙伴们,废话不多说开始:
<body>
<header></header>
<main></main>
<footer></footer>
</body>
一整个页面的代码就是这样<header>标签表示页面的头部,<footer>标签表示页面的底部,<main>是主内容标签,这样层次是不是很清楚。
在介绍下<header>标签里面放什么内容:
<header>
<div class="xx">头部背景或者什么
</div>
<nav>
导航
</nav>
</header>
可以把导航标签<nav>放到<header>中,如果你想分出页面头部和导航标签也可以分开,我自己写电商平台首页的时候还是放在<header>标签中会比较规整。
介绍一下<main>标签,首页页面一般都是分三大部分,多一些宣传广告用<div>标签包含为第四大部分:
<main>
<article>版块内容一</article>
<div>版块内容二</div>
<section>版块内容三</section>
<aside>版块内容四</aside>
<main>
这样就能在组内容分出那个版块是干什么的,层次是不是很明显啊!
在介绍下底部<footer>用于底部的版权所属,或者合作企业网站等等一些东西:
<footer>
<div>版权所属xxx</div>
</footer>
整体介绍完了 ,在介绍<main>标签里的几大部分的标签,<article>标签是放的第一大版块的内容,里面可以分成几个小版块内容:
<article>
<section>
<article></article>
<aside></aside>
</section>
</article>
这样层次能分的相当明确。<aside>标签是用来标识侧边栏的标签,也可以用来当做页脚上最后一个大版块的标签:
<aside>
<section>
<div></div>
<article></article>
<aside></aside>
<section>
</aside>
中心内容我就是用的<section>标签:
<section>
<article></article>
</section>
如果组内容有侧边栏再加一个,侧边栏的标签。以上就介绍到这里,做一下总结:
html5去除了传统的<div>标签,使代码的层次更加的明显,对于二次开发,或者是代码修改,能增加工作效率。