# 認識HTML標簽 ## **語義化標簽** ## 標簽的用途 在學習網頁制作時，常常會聽到一個詞，<span style="color:red">語義化</span>，那么什么叫語義化呢？通俗說就是：明白每個標簽的用途（在什么情況下使用什么標簽）比如：網頁上文章的標題可以使用標題標簽，網頁上的各個欄目的欄目名稱也可以使用**標題標簽**，文章中的內容的段落就得放在**段落標簽**中等等。 ## 段落標簽 如果想在網頁上顯示文章，這時就需要使用&lt;p&gt;標簽了，把文章的內容放到段落標簽中，語法如下: ``` <p>文章內容</p> ``` 示例： ``` <p> 這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落，這是第一個段落 </p> <p> 這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落，這是第二個段落 </p> ``` 效果：  P標簽的默認樣式，可以從上圖看出來，段前和段后都會有空白，如果想去掉這個空白，可以采用CSS去除。 ## 文本標簽 文本標簽沒有特殊的語義，它的作用就是為了設置單獨的樣式。 語法： ``` <span>文本內容</span> ``` 示例： ``` <p> HTML的全稱為<span style="color:red">超文本標記語言</span>，是一種標記語言。它包括一系列標簽．通過這些標簽可以將網絡上的文檔格式統一，使分散的Internet資源連接為一個邏輯整體。HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字，圖形、動畫、聲音、表格、鏈接等。超文本... </p> ``` 如果想把“超文本標記語言”的字體顏色改為紅色，這是就需要使用&lt;span&gt;標簽了。 ## 標題標簽 文章的內容是用&lt;p&gt;標簽，那么文章的標題使用什么標簽呢？在HTML中可以使用標題標簽來定義標題。 標題標簽一共有6個，分別為 h1,h2,h3,h4,h5,h6 語法： ``` <h1>一級標題</h1> <h2>二級標題</h2> <h3>三級標題</h3> <h4>四級標題</h4> <h5>五級標題</h5> <h6>六級標題</h6> ``` 示例：  ## DIV標簽 在網頁制作過程過中，可以把一些獨立的邏輯部分劃分出來，放在一個`<div>`標簽中，這個標簽的作用就相當于一個容器。 語法： ``` <div>內容</div> ``` **確定邏輯部分：** 什么是邏輯部分？它是頁面上相互關聯的一組元素。如網頁中的獨立的**欄目版塊**，就是一個典型的邏輯部分。如下圖所示：圖中用紅色邊框標出的部分就是一個邏輯部分，就可以使用`<div>`標簽作為容器。 ## 頭部區域 `<header></<header>` ## 底部區域 `<footer></<footer>` ## 區段 `<section></<section>` ## 側邊欄 `<aside></<aside>` ## *效果標簽* `<br/>`,`&nbsp;`,`<hr/>`