段落
HTML及CSS語法簡易教學
<p> </p> 段落標記，用來標示一個段落的範圍。
<b> </b> 粗體標記，用來標示粗體字的範圍。
<p style=" "> </p> CSS在HTML中的寫法。
font-size: large; CSS語言，選擇「large」的字型大小。
text-indent: 2em; CSS語言，首行縮排，em表示字元，此例為首行退縮2個字元（英文字母為0.5字元），負號表示為首行凸排。
margin-left: 2em; CSS語言，左邊界，此例為段落的所有行皆退縮2個字元。
margin-top: 12px; CSS語言，上邊界，此例為段落的上邊界下移12px（負值為上移）。
綜合上面的語法舉例說明：
<p style="text-indent: -2em; margin-left: 4em; margin-top: -12px;"> </p> 顯示的結果如下：
未加HTML+CSS語言：
一、這是第一個段落的第一行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- --- 這是第一個段落的第二行文字。----- ----- ----- ----- ----- ----- ----- ----- -----
二、這是第二個段落的第一行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- --- 這是第二個段落的第二行文字。----- ----- ----- ----- ----- ----- ----- ----- -----
加入HTML+CSS語言之後：
一、這是第一個段落的第一行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- 這是第一個段落的第二行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- -----
二、這是第 二個段落的第一行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- ----- 這是第二個段落的第二行文字。----- ----- ----- ----- ----- ----- ----- ----- ----- -----
上面的例子說明，利用text-indent及margin-left兩個語法可以控制段落的縮排、首行縮排或凸排，以便於讀者了解文章段落的 層階概念。而margin-top: -12px是因為程式預設段落之間有12px的間隔，設定-12px可以把兩段落的間隔移除。