1.標題<h></h>
HTML定義<h1></h1>到<h6></h6>六個<h>標簽，分別用來不同大小字體的標題（Heading）。字體由大到小，<h1>最大，<h6>則最小。
Heading標簽需要注意的是：a.瀏覽器會自動地在標題的前后添加空行。因為Heading標簽屬于塊級元素，而在默認情況下，HTML 會自動地在塊級元素前后添加一個額外的空行（<br/>）。b.標題對整個頁面來說很重要,應該將HTML heading 標簽只用于標題，而不要僅僅是為了產生粗體或大號的文本而使用標題。因為Heading標簽對SEO是很友好的，搜索引擎使用標題為您的網頁的結構和內容編制索引，而且用戶則以通過標題來快速瀏覽您的網頁，所以用標題來呈現文檔結構是很重要的。應該將 <h1> 用作主標題（最重要的），其后是 <h2>（次重要的），再其次是 <h3>，以此類推。
<!--<h>標簽是設置標題的，把重要的信息放在<h1>里面，搜索引擎會優先搜索--> <h1> 中國一</h1> <h2> 中國二</h2> <h3> 中國三</h3> <h4> 中國四</h4> <h5> 中國五</h5> <h6> 中國六</h6>
效果如下圖，字體大小由大到小：
2.換行<br/>、不換行<nobr></nobr>和分段<p></p>
關于HTML中的換行標簽<br/>和分段標簽<p></p>的區別是，換行標簽<br/>只是回車，<p></p>則是分段。因為<p>標簽屬于塊級元素，它的前后會有比較大的空白（自動添加<br/>），而<br/>標簽屬于行級元素，它只是簡單的換行，前后沒有空白。有一個與<br/>相對的標簽<nobr></nobr>，它表示不換行，通常用于防止瀏覽器將程序代碼等不需要換行的地方自動換行。
<!-- 換行和分段：--> <p> 這是第一段<br /> <!--換行--> 用到了換行標簽<br /> 請看效果<br /> 很容易理解</p> <p> 這是第二段</p> <!--分段，自動加換行--> <p> 這是第三段</p> <p> <nobr> <!--防止換行--> int i =0,j=10; </nobr> </p>
3.水平線標簽<hr/>
<hr /> 標簽在 HTML 頁面中創建水平線。使用水平線 (<hr> 標簽) 來分隔文章中的小節是一個辦法。<hr/>標簽可以設置寬度width和高度height，這兩個屬性又分別有像素和百分比的表示方式。此外，<hr/>標簽還有size（厚度）、color（顏色）和noshade（無陰影）的屬性。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body> <hr size="5" color="#FF0000" /> <!--定義了size（厚度）為5和color為紅色的hr標簽--> <hr width="60" /> <!--width屬性為60px--> <hr width="60%" /> <!--width為60%--> <hr size="10" /> <!--size為10px--> <hr size="10%" /> <!--size為10%--> <!--align屬性，可取值分別為left、right和center--> <hr width="20%" align="left" /> <hr width="20%" align="right" /> <hr width="20%" align="center" /> <hr color="#FF0000" /> <!--noshade屬性，設置無陰影效果--> <hr noshade="noshade" /> </body></html>
4.文本格式化標簽
<!--常用文本格式標簽--> <center>博客園</center>居中顯示 <b>Hello，World！</b>粗體，推薦使用<strong>標簽。 <i>斜了吧</i>斜體。 <u>我是一個下劃線標簽</u>帶下劃線。 <em>強調，斜體</em> <sub>2</sub>下標，如：H<sub>2</sub>O <sup>2</sup>上標，如：10<sup>2</sup> <!--設置字體大小可分為絕對字體大小和相對字體大小，絕對的通過<font>標簽的size屬性來設置， 而相對字體大小為默認字體的相對值--> <!--絕對字體大小為size的值是1-7的某個數--> <!--color（設置顏色） size（1-7）。--> <!--face屬性用于設置字體--> <font></font>字體標簽，<font color=“red“ size=“7” face=“隸書”>紅色</font>
5.預格式化標簽<pre>
<pre> 預格式化標簽，保持網頁的內容原樣展示。可以用于某些特殊內容的展示，也可以用于顯示計算機編程的源代碼（比如博客園的源代碼就是通過<pre>標簽來顯示的）。
<p>pre 標簽顯示某些特殊的希望原樣展示的內容：</p> <pre> 我是個好孩子， 我喜歡中 啊啊啊啊 這是一個預格式化標簽 ____ (. / / | / |___(/--/) __/ ( . . ) "'._. '-.O.' 你好，我是一只小貓！ '-. / "|/ '.,,/'.,, (⊙_⊙)？你說什么呢？？？？ </pre> <p>pre 標簽很適合顯示計算機代碼：</p> <pre> for i = 1 to 10 print i next i </pre>
6.<marquee></marquee>標簽
<marquee></marquee>標簽對告訴瀏覽器移動顯示其中的文本和圖像。
<div> <!--marquee標簽部分瀏覽器支持:IE、FF--> <!--direction屬性：指定內容的移動方向，可取值有left、right、up和down--> <!--behavior屬性：指定標簽的行為，可取值有scroll、alternate和slide--> <marquee direction="left" scrolldelay="" behavior="alternate"> 大家好，歡迎大家來到我的主頁！...... </marquee> </div>
7.其它的格式標簽例子。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head> <body> <!--<abbr>顯示縮寫：--> <abbr BBC</abbr><br /> <!-- <acronym>顯示一個詞組的縮寫字頭：--> <acronym <!--<blockquote>定義了長文字的引用:--> <blockquote> <p> Beyond two or three days ,the world's best forecasts are speculative ,and beyond six or seven they are worthless. </p> <br /> <!-- <q>標簽定義短引用：--> <q>The q lable!!!</q> </blockquote> <!--<address>地址，簽名，文檔的作者信息等:--> <address> 北京市海淀區中關村軟件園 [email protected] </address> <!--<bdo>標簽通過dir屬性來定義文字顯示的順序：--> <bdo dir="ltr">動力節點</bdo><br /> <!--ltr：left to right,從左到右--> <bdo dir="rtl">動力節點</bdo><br /> <!--rtl:right to left,從右到左--> </body> </html>
二、HTML列表
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w.org//xhtml"> <head> <title></title> </head> <body> <b>HTML列表:</b><br /> <hr size="5" color="#FF0000;" /> <br /> <!--第一，無序列表（ul:unordered list)--> <font size="+" color="#FF" face="華文楷體">I.無序列表(Unordered List):</font><br /> .默認：<br /> <ul> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ul> .用type屬性:<br /> <!--ul type屬性的取值： disc:實心圓、circle:空心圓、square:實心方塊--> <!--ol type屬性的取值： <ul type="I"/"a"/"A"/"1"> --> <ul type="circle"> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ul> <ul type="square"> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ul> 3.屬性值的混合使用，起強調作用：<br /> <ul type="circle"> <li>香蕉</li> <li type="disc">蘋果</li> <li>橘子</li> </ul> <!--第二，有序列表(ol,ordered list)--> <font size="+1" color="#00FF00" face="華文楷體">II.有序列表(Ordered List)：</font><br /> .默認：<br /> <ol> <li>籃球</li> <li>排球</li> <li>足球</li> </ol> 2.使用type屬性：<br /> <ol type="i"> <li>籃球</li> <li>排球</li> <li>足球</li> </ol> <ol type="A"> <li>籃球</li> <li>排球</li> <li>足球</li> </ol> 3.改變有序列表項的前導編號：<br /> <blockquote> a.<font color="#FFFF">start</font>屬性單獨使用：<br /> <ol start="3"> <li>籃球</li> <li>排球</li> <li>足球</li> </ol> b.<font color="#FFFF">vlaue</font>屬性單獨使用:<br /> <ol> <li>籃球</li> <li value="5">排球</li> <li>足球</li> </ol> c.<font color="#FFFF">start、value</font>屬性的共同使用：<br /> <ol start="8"> <li>籃球</li> <li value="15">排球</li> <li>足球</li> </ol> </blockquote> <font size="+1" color="#00FF00" face="花紋楷體">III.嵌套列表(Nested Lists)：</font><br /> 1.無序列表中嵌套無序列表:<br /> <ul> <li>飲料</li> <li>水果 <ul> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ul> </li> <li>蔬菜</li> <li>茶葉</li> </ul> 2.無序列表中嵌套有序列表:<br /> <ul> <li>飲料</li> <li>水果 <ol> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ol> </li> <li>蔬菜</li> <li>茶葉</li> </ul> 3.有序列表中嵌套有序列表：<br /> <ol> <li>飲料</li> <li>水果 <ol> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ol> </li> <li>蔬菜</li> <li>茶葉</li> </ol> 4..有序列表中嵌套無序列表：<br /> <ol> <li>飲料</li> <li>水果 <ul> <li>香蕉</li> <li>蘋果</li> <li>橘子</li> </ul> </li> <li>蔬菜</li> <li>茶葉</li> </ol> 5.列表的多級嵌套：<br /> <ol> <li>飲料</li> <li>水果 <ul> <li>香蕉</li> <li>蘋果 <ul> <li>產自巴西</li> <li>產自中國</li> </ul> </li> <li>橘子</li> </ul> </li> <li>蔬菜</li> <li>茶葉</li> </ol> <!--第三，定義列表（dl,definition list)--> <font size="+1" color="#00FF00">IV.定義列表：</font><br /> 1.定義列表：<br /> <!-- <dl> <dt>第一個標題項</dt> <dd>對第一個標題項的解釋性文字</dd> <dt>第二個標題項</dt> <dd>對第二個標題項的解釋性文字</dd> </dl> 其中：<dl>用來標識定義列表的開始； <dt>用來標識定義列表的列表項； <dd>用來標識定義列表中列表項的解釋性文字。 --> <dl> <!--dt:definition term(定義術語)定義“北京”這個標題項--> <dt>北京</dt> <!--dd:definition definition(定義對術語的解釋定義)對“北京”這個標題項的解釋--> <dd> 中國的政治中心</dd> <dt>上海</dt> <dd> 中國的經濟中心</dd> <dt>深圳</dt> <dd> 中國改革開放的前沿城市</dd> </dl> </body> </html>
很多標簽都可以用來改變文本的外觀，并為文本關聯其隱藏的含義。總地來說，這些標簽可以分成兩類：基于內容的樣式（content-based style）和物理樣式（physical style）。
1.基于內容的樣式（content-based style）
基于內容的樣式標簽會告訴瀏覽器它所包含的文本具有特定的含義、上下文或者用法。然后瀏覽器就會把與該含義、上下文或者用法一致的格式應用在文本上。注意，基于內容的標簽賦予含義，而不是格式化。因此，它們對于自動處理來說非常重要；計算機并不關心文檔的外觀如何。
因為字體樣式是通過語義線索來指定的，因此瀏覽器可以為用戶選擇一種合適的顯示樣式。由于不同地點的樣式各種各樣，所以使用基于內容的樣式可以幫助你確保自己的文檔對廣大范圍的讀者來說都是有意義的。這一點在專門供那些盲人和殘疾人所使用的瀏覽器上顯得尤其重要，因為他們的顯示選項可能和我們傳統的文本根本不同，或者在某方面具有非常大的局限性。
當前的 HTML 和 XHTML 標準并沒有為每一個基于內容的標簽都定義一種格式；它們僅僅規定必須用與文檔中普通文本不同的方式來顯示基于內容的樣式。標準甚至沒有要求這些基于內容的樣式彼此之間都要用不同的方式顯示。在實際應用中，你可能會發現很多這樣的標簽和傳統的印刷有著非常明顯的關系，它們有著相似的含義和顯示樣式，而且在多數瀏覽器中都以相同的樣式和字體來顯示。
使用 HTML/XHTML 基于內容的樣式標簽時要遵從一些規則，因為僅僅是簡單地想想文本該如何顯示，而不必知道這些文本的含義是什么，是十分容易的。一旦你開始使用基于內容的樣式之后，文檔將會更加一致，而且可以更好地幫助執行自動搜索和內容編輯。這些標簽是：
<abbr> <acronym> <cite> <code> <dfn> <em> <kbd> <samp> <strong> <var>
2.物理樣式（physical style）
在討論基于內容的樣式標簽時，我們經常用到“意圖”這個詞。這是因為由標簽傳達的含義比瀏覽器顯示文本的方式更為重要。然而，在某些情況下，可能是出于合法性或者版權等方面的原因的考慮，你希望文本以某種特殊的方式來顯示（例如斜體或加粗）。在這種情況下，就可以對文本使用物理樣式。
雖然其他文字處理系統的趨勢是精確地控制樣式和外觀，但是在使用 HTML 或 XHTML 時，除非極少情況下，都應該避免使用物理標簽。應當盡可能地向瀏覽器提供上下文信息，并使用基于內容的樣式。盡管現在瀏覽器不過是以斜體或者粗體字來顯示這些文本，但是將來的瀏覽器和各種文檔生成工具可能會以非常有創建的方式來利用這些基于內容的樣式。
當前的 HTML/XHTML 標準一共提供了 9 種物理樣式，包括粗體（bold）、斜體（italic）、等寬（monospaced）、下劃線（underlined）、刪除線（strikethrough）、放大（larger）、縮小（smaller）、上標（superscripted）和下標（subscripted）文本。這些標簽是：
<b> <big> <i> <s> <small> <strike> <sub> <sup> <tt>
以上所述是小編給大家介紹的HTML常用格式標簽，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對VeVb武林網網站的支持！
新聞熱點
疑難解答
