HTML5 基础

来源:互联网 发布:windows xp 光盘镜像 编辑:程序博客网 时间:2024/06/01 13:12

语义化标签

语义化标签的优点

 1.具有可读性,2.没有css情况下,页面也能出现很好的内容结构和代码结构,3.搜索引擎可以更好的理解页面中各部分的关系,可以搜索到更快,更准确的信息。

语义化标签的布局

相关代码:<!DICTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style type="text/css">         *{             margin:0;             pading:0;             text-align:center;         }         header,footer{            width: 100%;            height: 35px;            line-height: 35px;            background-color: gray;        }        nav{            width: 80%;            height: 40px;            background-color: #00c3f5;            margin: 0 auto;        }        #content{            width: 80%;            height: 400px;            line-height: 400px;            margin: 0 auto;        }        article{            width: 75%;            height: 400px;            background-color: #6fc749;            float: left;        }        aside{            width: 25%;            height: 400px;            background-color: #eb8f00;            float: left;        }    <style></head><body><header> 头部 </header><nav>导航</nav><!-- 内容区--><section id="content">   <article>       <section>左边内容区</section>   </article>   <aside>侧边栏</aside></section><footer>底部</footer></body></html>