一、學習目標
網頁內容的排版包括文本格式化、段落格式化和整個頁面的格式化，這是設計個網頁的基礎。文本格式化標記分為字體標記、文字修飾標記。字體標記和文字修飾標記包括對于字體樣式的一些特殊修改。段落格式化標記分為段落標記、換行記、水平分隔線標記等。
通過對文本與段落格式化知識的學習，讀者能夠掌握頁面內容的初步設計，理解并掌握 HTML 標題字標記、空格及特殊符號的使用；理解格式化標記中的文本修飾標記、計算機輸出標記、引用和術語標記以及字體 font 標記的語法和使用；理解段落與排版標記的語法，學會編寫簡易的 Web 頁面代碼。
二、Web頁面初步設計
Web頁面設計需要遵循簡潔、一致性、有好的對比度的設計原則。簡潔是指以滿足人們的實際需求為目標，要求簡練，準確。一致性是指網站中的各個頁面使用相同的頁邊距，頁面中的每個元素與整個頁面以及站點的色彩和風格保持一致。對比度在于強調、突出關鍵內容，以吸引瀏覽者，鼓勵他們去發掘更深層次的內容。
1.1 向Web頁面中添加文字信息
在 HTML 文件中，主體內容被包含在<body></body >標記之間，并且 body 標記有很多自身的屬性，例如設置頁面背景、設置頁面邊界等。
1.1.1 基本語法
<body>向這里添加內容</body>1.1.2 語法說明
body標記定義文檔的主體。
body標記包含文檔的所有內容（例如文本、超鏈接、圖像、表格和列表等）。
一個簡單的HTML文檔必須包含最基本的必備的標記。
1.2 標題字標記
標題字標記由h1~h6共6種標記組成。標記中的字母h是英語Heading的簡稱。作為標題字，h1 標記定義最大的標題字，h6標記定義最小的標題字。h1 標記到 h6標記屬于塊級標記，它們必須在HTML中首尾成對出現。瀏覽器會自動地在標題的前后添加空行。
1.2.1 基本語法
<h1 align="left|centerlright|justify">1號標題文字</h1>
<h2 align="left|centerlrightljustify">2號標題文字</h2>
<h3 align="left|centerlright|justify">3號標題文字</h3>
<h4 aliqn="left|center right|justify">4號標題文字</h4>
<h5 align="left|centerlright|justify">5號標題文字</h5>
<h6 align="left|centerlright|justify">6號標題文字</h6>1.2.2 語法說明
h后面的數字越小，標題字越大。標題字標記的align屬性用來定義標題字的對齊方式，對齊方式有4種，分別是left、center、right、jstify。但是一般推薦設計者使用CSS樣式表來定義對齊方式。
標題文字的大小由它們的重要性決定,等級越高的標題字號越大。在設計時要對各級標題有所規劃。
1.3 添加空格與特殊符號
在HTML文檔中，添加空格的方式與在其他文檔中添加空格的方式不同，在網頁中通過代碼控制來添加空格，而在其他編輯器中通過鍵盤空格鍵來輸入空格。
1.3.1 基本語法
<body> <®×
</body>1.3.2 語法說明?
在網頁中添加空格使用“ ”，其中“nbsp”是指Non Breaking Space，空格數量與“ ”的個數相同。
在網頁中插人特殊字符與插入空格符號的方式相同。特殊字符對應的符號代碼如下表。
| 顯示結果 | 說明 | 符號代碼 |
|---|---|---|
| 顯示一個空格 | | |
| < | 小于 | $lt; |
| > | 大于 | > |
| & | &符號 | & |
| " | 雙引號 | " |
| ? | 版權 | ® |
| × | 稱號 | × |
| ÷ | 除號 | ÷ |
對于HTML文檔中特殊字符對應的代碼，瀏覽器解釋后會顯示對應的特殊符號。
三、格式化文本標記
HTML中提供了很多格式化文本的標記，例如文字加斜、斜體、下畫線、底紋、上/下標等。
2.1 文本修飾標記
對于文本修飾標記，各類瀏覽器均支持，在各類網頁開發工具中仍然有這類標記。常見的文本修飾標記如下表。
| 標記 | 說明 |
|---|---|
| <b>軟件工程專業! </b> | 定義粗體 |
| <i>軟件工程專業! </i> | 定義斜體 |
| <u>軟件工程專業! </u> | 定義下畫線 |
| <del>軟件工程專業! </del> | 定義刪除線 |
| <sup>軟件工程專業! </sup> | 定義上標 |
| <sub>軟件工程專業! </sub> | 定義下標 |
| <strong>軟件工程專業! </strong> | 定義著重文字，與<b></b>效果相同 |
| <em>軟件工程專業! </em> | 定義加重語氣，與<i></i>效果相同 |
| <small>軟件工程專業! </small> | 變小字號 |
| <big>軟件工程專業! </big> | 變大字號 |
2.2 字體標記
在不指定任何樣式的情況下，瀏覽器會把字體顯示為16px、黑色、宋體，因此在設計網頁時要根據需要更改不同段落的字體。在HTML5中可以使用CSS中的字體屬性替代。
字體標記(font)規定文本的字體系列、字體尺寸、字體顏色，所有瀏覽器均支持font標記。
2.2.1 基本語法
<font face = "" size ="" color ="" >…</font>2.2.2 屬性說明?
字體標記(font)的屬性、取值及說明如下表。
| 屬性 | 取值 | 說明 |
|---|---|---|
| size | +1~+7、1~7、-1~-7 | 數字越大字號越大，負數字越大字號越小。“＋”表示號比原來的字號大一些，“-”表示字號比原來的字號一些 |
| color | rgb(r,g, b)、rgb(r%,g%,b%)#rrggbb或#rgbcolorname | 規定文本的顏色。可以使用rgb()函數、十六進制數、顏色的英文名稱來表達 |
| face | 字體1，字體2，…，字體n | face屬性可以有多個值，用逗號分隔。字體使用方式為從左向右依次選用。如果前面的字體不存在，則使用后一個字體。若都不存在,則默認使用“宋體” |
格式化文本與段落（上）就到這里，下級將更新段落與排版標記，也是格式化文本與段落的重點內容。
![python manimgl數學動畫演示_微積分_線性代數原理_ubuntu安裝問題[已解決]](http://pic.xiahunao.cn/python manimgl數學動畫演示_微積分_線性代數原理_ubuntu安裝問題[已解決])
