明輝手游網(wǎng)中心：是一個(gè)免費(fèi)提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺(tái)！

案例說明HTML文本格式化的知識(shí)

發(fā)表時(shí)間：2024-05-10 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]本文就為大家?guī)硪黄狧TML文本格式化的簡單實(shí)例(詳解)。希望大家學(xué)完能掌握HTML 文本格式化的知識(shí)，更好的去運(yùn)用。一，文本格式化：此例演示如何在一個(gè) HTML 文件中對文本進(jìn)行格式化。<html><body><b>This text is bold</...
本文就為大家?guī)硪黄狧TML文本格式化的簡單實(shí)例(詳解)。希望大家學(xué)完能掌握HTML 文本格式化的知識(shí)，更好的去運(yùn)用。

一，文本格式化：此例演示如何在一個(gè) HTML 文件中對文本進(jìn)行格式化。

<html>
<body>
<b>This text is bold</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 />
This text contains   
<sup>superscript</sup>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

二，預(yù)格式文本：此例演示如何使用 pre 標(biāo)簽對空行和空格進(jìn)行控制。


<html>
<body>
<pre>
這是   
預(yù)格式文本。   
它保留了      空格   
和換行。   
</pre>
<p>pre 標(biāo)簽很適合顯示計(jì)算機(jī)代碼：</p>
<pre>
for i = 1 to 10   
     print i   
next i   
</pre>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

三，“計(jì)算機(jī)輸出”標(biāo)簽：此例演示不同的“計(jì)算機(jī)輸出”標(biāo)簽的顯示效果。

<html>
<body>
<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />
<p>
<b>注釋：</b>這些標(biāo)簽常用于顯示計(jì)算機(jī)/編程代碼。   
</p>
</body>
</html>

效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

四，地址：此例演示如何在 HTML 文件中寫地址。


XML/HTML Code復(fù)制內(nèi)容到剪貼板
<!DOCTYPE html>
<html>
<body>
<address>
Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA   
</address>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

五，縮寫和首字母縮寫：此例演示如何實(shí)現(xiàn)縮寫或首字母縮寫。

<html>
<body>
<abbr title="etcetera">etc.</abbr>
<br />
<acronym title="World Wide Web">WWW</acronym>
<p>在某些瀏覽器中，當(dāng)您把鼠標(biāo)移至縮略詞語上時(shí)，title 可用于展示表達(dá)的完整版本。</p>
<p>僅對于 IE 5 中的 acronym 元素有效。</p>
<p>對于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。</p>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

六，文字方向：此例演示如何改變文字的方向。

<html>
<body>
<p>
如果您的瀏覽器支持 bi-directional override (bdo)，下一行會(huì)從右向左輸出 (rtl)；   
</p>
<bdo dir="rtl">
Here is some Hebrew text   
</bdo>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

七，塊引用：此例演示如何實(shí)現(xiàn)長短不一的引用語。

<html>
<body>
這是長的引用：   
<blockquote>
這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。這是長的引用。   
</blockquote>
這是短的引用：   
<q>
這是短的引用。   
</q>
<p>
使用 blockquote 元素的話，瀏覽器會(huì)插入換行和外邊距，而 q 元素不會(huì)有任何特殊的呈現(xiàn)。   
</p>
</body>
</html>

效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

八，刪除子效果和插入子效果。

<html>
<body>
<p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
<p>大多數(shù)瀏覽器會(huì)改寫為刪除文本和下劃線文本。</p>
<p>一些老式的瀏覽器會(huì)把刪除文本和下劃線文本顯示為普通文本。</p>
</body>
</html>



效果如下：

實(shí)例介紹HTML文本格式化的知識(shí)

打擊學(xué)會(huì)了嗎？趕緊動(dòng)手自己嘗試一下吧。

相關(guān)推薦：

總結(jié)類html標(biāo)題，段落，換行，水平線，特殊字符

HTML實(shí)現(xiàn)簡單的提示框

怎么選擇合適的HTML標(biāo)簽

以上就是實(shí)例介紹HTML文本格式化的知識(shí)的詳細(xì)內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！


網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。