web-3. 用於頁面排版的格式標記
3. 用於頁面排版的格式標記
本節課用於介紹文字的排版、段落的排版、列表的建立、註釋的使用。
3.1 文字的排版
- 標題標記
由開始標記<hn>和結束標記</hn>共同組成，要顯示的標題內容插入在開始標記與結束標記之間。標題標記一般包含在<body>標記中。
格式如下：<hn>......</hn>，其中n的取值範圍是1到6。
HTML語言中的標題標記從高到低，分為6個等級：<h1>、<h2>、<h3>、<h4>、<h5>、<h6>。每級標題的字體大小依次遞減。
例如：
<html>
<head>
<title>標題的等級實例</title>
</head>
<h1>1級</h1>
<h2>2級</h2>
<h3>3級</h3>
<h4>4級</h4>
<h5>5級</h5>
<h6>6級</h6>
</body>
</html>
- 字體標識
（1）<font>用來設置字體的樣式，格式如下：
<font face=”字體” size=字號
（2）face設置字體
（3）size設置大小，可以使1-7，也可以在前面加上(+)或者(-)號，表示相對大小
例如：
<html>
<head>
<title>標題的等級實例</title>
</head>
<body>
<font size=7>字號設置實例</font><br>
<font size=6>字號設置實例</font><br>
<font size=5>字號設置實例
<font size=4>字號設置實例</font><br>
<font size=3>字號設置實例</font><br>
<font size=2>字號設置實例</font><br>
<font size=1>字號設置實例</font><br>
字號設置實例<br>
<font size=+1>字號設置實例</font><br>
</body>
</html>
註：HTML默認的字體大小是3
（4）color用來設置顏色，有兩種表示方法：一種是利用RGB顏色值，以#字開頭，如：#001122，每兩位表示一個顏色的深淺；另一種是直接顯示顏色
例子：
<html>
<head>
<title>color</title>
</head>
<body>
<font color=#000000>黑色</font><br>
<font color=gray>灰色</font><br>
<font color=#00ff00>綠色</font><br>
<font color=silver>銀白色</font><br>
</body>
</html>
- 文字修飾
<b>粗體</b>
<strong>粗體</strong>
<i>斜體</i>
<em>斜體</em>
<cite>斜體</cite>
<big>字號加大一級</big>
<small>字號減小一級</small>
<b>X</b><sup>2</sup> 上角號
<b>Y</b><sub>2</sub> 下角號
例如：
<html>
<head>
<title>decorate</title>
</head>
<body>
<b>粗體</b>
<strong>粗體</strong>
<i>斜體</i>
<em>斜體</em>
<cite>斜體</cite>
<big>字號加大一級</big>
<small>字號減小一級</small>
<b>X</b><sup>2</sup>
<b>Y</b><sub>2</sub>
</body>
</html>
- 特殊符號
這裏的特殊符號特別多，我們給出下面的地址，我們先記住 表示的是空格，切記有分號。
http://www.fhdq.net/ts/177.html
3.2 段落的排版
- 段落標記和對齊方式
<p align=對齊方式>......</p> 其中結束標記</p>可以省略
align=lift 表示左對齊
align=right 表示右對齊
align=center 表示中間對齊
- 換行標記
<br>
- 居中標記
<center>......</center>
- 水平分隔線
<hr size=厚度值 noshade width=寬度值 align=對齊方式>
水平分隔線標識的size屬性用來設置分割線的厚度（以像素為單位）；noshade屬性用來去掉3D效果；width屬性用來設置分割線的寬度（以像素為單位），默認分隔顯示橫跨整個瀏覽器窗口；align屬性用來設置分割線的對齊方式，默認值是center。
- 預編排標識
預編排標識<pre>可以預先定義好一段文字，瀏覽器將完全按照在源代碼中的效果顯示。預編排標記的一個常見應用就是用來顯示源代碼。
例子：
<html>
<head>
<title>pre</title>
</head>
<body>
<pre>
main
</pre>
</body>
</html>
3.3 列表的建立
- 無序列表
無序列表<ul>用項目符號來表示一個沒有特定順序的相關條目的集合。
無序列表使用一對標記<ul>、</ul>，並且每個表項要使用<li>標記進行定義，</ul>可以省略。
例如：
<html>
<head>
<title>pre</title>
</head>
<body>
what will we eat today?
mian food:
<ul>
<li>rice</li>
<li>hambuger</li>
</ul>
</body>
</html>
- 有序列表
有序列表<ol>在列表項目前添加的是編號不是項目符號，在排序的時候會用到它。、
樣式：
<ol type=樣式 start=起始值>
<li>......</li>
......
</ol>
type的可選範圍有：1（數字序號）、a（小寫字母）、A（大寫字母）、i（小寫羅馬字母）、I（大寫羅馬字母），默認的值是1。
例如：
<html>
<head>
<title>pre</title>
</head>
<body>
今天的功課有：
<ol>
<li>數學</li>
<li>語文</li>
</ol>
明天的功課有：
<ol type=a start=3>
<li>數學</li>
<li>語文</li>
</ol>
</body>
</html>
- 定義列表
定義列表又稱為字典列表，是表現術語表、名詞列表等的理想方式。
格式：
<dl>
<dt>術語項</dt>
<dd>前面術語的解釋</dd>
<dt>術語項</dt>
<dd>前面術語的解釋</dd>
......
</dl>
3.4 註釋的使用
格式：<!__*******************__>
由<!__和__>組成。
web-3. 用於頁面排版的格式標記