语义化标签（二）与列表

页面布局  （结构化语义标签）

<header></header>表示网页的头部

<main></main>表示网页的主题部分（一个页面只能有一个）

<footer></footer表示网页的底部>

【以上是HTML5的新增标签】

<nav> </nav>  表示网页中的导航

<aside></aside>表示和我们主体相关的其他内容（侧边栏）

<article></article>表示一个独立的文章

<section></section>他表示一个独立的区块，上边的标签都不能表示时，使用section

<div></div>没有语义，就用来表示一个区块。目前来讲div还是我们主要的布局元素

<span></span>是一个行内元素，也是没有任何的语义，一般用于在网页中选中文字。

list（列表）

在html中也可以创建列表，html列表一共有三种

1.无序列表：使用ul标签来创建无序列表<ul></ul>

使用li表示列表项

例：           【老虎，狮子，豹子在这里只是一个形容词】

         <ul> 

               <li>老虎</li>  (网页中所显示)  ·老虎

              <li>狮子</li>   (网页中所显示)  ·狮子

              <li>豹子</li>   (网页中所显示)  ·豹子

         </ul>

2.有序列表：使用ol标签来创建有序列表<ol></ol>

使用li表示列表项

例：<ol>

              <li>老虎</li>   (网页中所显示)  1.老虎

              <li>狮子</li>   (网页中所显示)   2.狮子

              <li>豹子</li>   (网页中所显示)   3.豹子

        </ol>

3.定义列表：使用dl标签来表示定义的内容，使用dd来对内容进行解释说明

 

例：<dl>

             <dt>老虎</dt>

             <dd>这里是对老虎的解释</dd>

        </dl>

 

【列表之间可以相互嵌套】