h5语义化标签

 

我们直接进入主题，什么是语义化标签呢？语义化标签简单理解就是我们能通过标签名就能判断出该标签内容，我认为语义化标签主要能解决我们在div套娃（嵌套）和起名的繁琐。

下面我们开始说一下常用滴搭建结构的语义化标签：

section：类是div，但更加偏向于划分区域；

section{
            width:500px;
            height:500px;
            background:red;
            margin:0 auto;

header：头部，表示网页头部、内容头部等；

header{
            width:500px;
            height:30px;
            background:yellow;
            text-align:center;
            font-size:20px;
            line-height:30px;

nav：导航区域；

nav{
            width: 500px;
            height:40px;
            background: orangered;
        }

article：偏向于内容的展示，内容区域；

 article{
            width:300px;
            height:400px;
            background: blueviolet;
            float: left;
        }

aside：在一边，侧边的区域；

   aside{
            width: 200px;
            height:400px;
            float:left;
            background: chartreuse;
        }

figure：表示一块独立的内容区；

figure{
            height:100px;
            background: crimson;
        }

 

 

figcaption:firure的标题（可用在最前和最后）

figcaption{
            background: cyan;
        }

 

footer:内容底部，网页底部等；

 footer{
            width:500px;
            height:100px;
            background: darkmagenta;
            text-align:center;
        }

 

 

这就是我们常用的搭建结构的语义化标签