段落相關标簽<p><br><hr>
格式化相關标簽<small><sub><sup><pre>
清單相關标簽<ol><ul><li>
圖檔相關标簽<img>
超鍊相關标簽<a>
本章重點：段落相關标簽，超鍊标簽
本章難點：超鍊相關标簽<a>
一、 段落相關标簽
标題元素：
标題元素由标簽<h1>到<h6>定義。<h1>定義了最大的标題元素，<h6>定義了最小的。
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>
HTML自動在一個标題元素前後各添加一個空行。
段落：
段落是用<p>标簽定義的。
<p>This isanother paragraph</p>
HTML自動在一個段落前後各添加一個空行。
換行：
當需要結束一行，并且不想開始新段落時，使用<br>标簽。<br>标簽不管放在什麼位置，都能夠強制換行。
<p>This<br> is a para<br>graph with line breaks</p>
<br>标簽是一個空标簽，它沒有結束标記。
二、 格式化相關标簽
格式化文字：
<html>
<body>
<b>This text isbold</b><br>
<strong>
This text is strong
</strong><br>
<big>
This text is big
</big><br>
<em>
This text is emphasized
</em><br>
<i>
This text is italic
</i><br>
<small>
This text is small
</small><br>
This text contains
<sub>
subscript
</sub><br>
<sup>
superscript
</sup>
</body>
</html>
這個例子說明了在HTML裡面可以怎樣格式化文本。
三、 清單相關标簽
無序清單：
無序清單是一個項目的序列。各項目前加有标記（通常是黑色的實心小圓圈）。
無序清單以<ul>标簽開始。每個清單項目以<li>開始。
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
無序清單的項目中可以加入段落、換行、圖像，連結，其他的清單等等。
有序清單：
有序清單也是一個項目的序列。各項目前加有數字作标記。
有序清單以<ol>标簽開始。每個清單項目以<li>開始。
<ol>
</ol>
更多示例：
有序清單的不同類型：
<h4>Numbered list:</h4>
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
<h4>Letters list:</h4>
<oltype="A">
<h4>Lowercase letters list:</h4>
<oltype="a">
<h4>Roman numberslist:</h4>
<oltype="I">
<h4>Lowercase Roman numberslist:</h4>
<oltype="i">
<li>Oranges</li>
這個例子顯示了有序清單的不同類型。
無序清單的不同類型：
<h4>Disc bullets list:</h4>
<ultype="disc">
<h4>Circle bulletslist:</h4>
<ultype="circle">
<h4>Square bullets list:</h4>
<ultype="square">
這個例子顯示了無序清單的不同類型。
四、 圖檔相關标簽
Img标簽和src屬性：
在HTML裡面，圖像是由<img>标簽定義的。
<img>是空标簽，意思是說，它隻擁有屬性，而沒有結束标簽。
想要在頁面上顯示一個圖像，需要使用src屬性。“src”表示“源”的意思。“src”屬性的值是所要顯示圖像的URL。
插入圖像的文法：
URL指向圖像存儲的位址。網站“www.w3schools.com”子目錄“images”中的圖像“boat.gif”的URL如下： “http://www.w3schools.com/images/boat.gif”。
當浏覽器在文檔中遇到img标簽時，就放置一個圖像。如果把img标簽放在兩個段落之間，就會先顯示一個段落，然後是這個圖像，最後是另外一個段落。
alt屬性：
alt屬性用來給圖像顯示一個“互動文本”。alt屬性的值是由使用者定義的。
“alt”屬性在浏覽器裝載圖像失敗的時候告訴使用者所丢失的資訊，此時，浏覽器顯示這個“互動文本”來代替圖像。給頁面上的圖像都加上alt屬性是一個好習慣，它有助于更好地顯示資訊，而且，對純文字浏覽器很有用。
基本注意點——有用的技巧:
如果一個HTML文檔包含10個圖像，那麼為了正确顯示這個頁面，需要加載11個檔案。加載圖像是需要時間的，是以請謹慎使用圖像。
調整圖像大小：
<p>
<imgsrc="./images/hackanm.gif" width="20"
height="20">
</p>
<imgsrc="./images/hackanm.gif" width="45"
height="45">
<imgsrc="./images/hackanm.gif" width="70"
height="70">
Youcan make a picture larger or smaller changing the values in the
"height" and "width" attributes of the img tag.
背景圖像：
<bodybackground="./images/background.jpg">
<h3>Look: A backgroundimage!</h3>
<p>Both gif and jpg files can be usedas HTML backgrounds.</p>
<p>If the image is smaller than thepage, the image will repeat itself.</p>
圖像連結：
You can also use an image as a link:
<a href="back.htm">
<img border="0" src="./images/next.gif">
</a>
五、 超鍊相關标簽
錨标簽和href屬性：
HTML使用錨标簽（<a>）來建立一個連接配接到其他檔案的連結。錨可以指向網絡上的任何資源：HTML頁面，圖像，聲音，影片等等。
建立一個錨的文法：
錨可以指向網絡上的任何資源：HTML頁面，圖像，聲音，影片等等。
标簽<a>被用來建立一個連結指向的錨，href屬性用來指定連接配接到的位址，在錨的起始标簽<a>和結束标簽</a>中間的部分将被顯示為超級連結。
這個錨定義了一個到W3Schools的連結：
上面這段代碼在浏覽器中顯示的效果如下：
target屬性：
使用target屬性，你可以定義從什麼地方打開連結位址。
下面這段代碼打開一個新的浏覽器視窗來打開連結：
錨标簽和name屬性
name屬性用來建立一個命名的錨。使用命名錨以後，可以讓連結直接跳轉到一個頁面的某一章節，而不用使用者打開那一頁，再從上到下慢慢找。
下面是命名錨的文法：
你可以為錨随意指定名字，隻要你願意。下面這行代碼定義了一個命名錨：
你應該注意到了：命名錨的顯示方式并沒有什麼與衆不同的。
想要直接連結到“tips”章節的話，在URL位址的後面加一個“#”和這個錨的名字，就像這樣：
一個連結到本頁面中某章節的命名錨是這樣寫的：
基本注意點——有用的技巧：
盡量在子目錄路徑後面加一個左斜杠。假如你像下面這樣寫：href="http://www.w3schools.com/html"，将會産生向伺服器産生兩個HTTP請求，因為伺服器會在後面追加一個左斜杠，産生一個新的請求，就像這樣：href="http://www.w3schools.com/html/"。
命名錨通常用來在大型文檔的開頭建立章節表。這個頁面的每個章節被加上一個命名錨，到這些錨的連結被放在頁面的頂端。
如果浏覽器無法找到指定的命名錨，它将轉到這個頁面的頂部，而不顯示任何錯誤提示。
在新浏覽器視窗中打開連結：
<a href="lastpage.htm"target="_blank">Last Page</a>
If you set the target attribute of a link to"_blank",
the link will open in a new window.
單擊超連接配接，打開一個新視窗：
連結到本頁面的某個位置：
<a href="#C4">
See also Chapter 4.
<h2>Chapter 1</h2>
<p>This chapter explains ba blabla</p>
<h2>Chapter 2</h2>
<h2>Chapter 3</h2>
<aname="C4"><h2>Chapter 4</h2></a>
單擊超連接配接
![寶塔java項目部署日志路徑[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)