HTML 文本格式化

直接上代碼:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head> 
<body>

<b>加粗文本</b><br><br>
<i>斜體文本</i><br><br>
<code>電腦自動(dòng)輸出</code><br><br>
這是 <sub> 下標(biāo)</sub> 和 <sup> 上標(biāo)</sup>

</body>
</html>

HTML 格式化標(biāo)簽


HTML 使用標(biāo)簽<b><i> 對(duì)輸出的文本進(jìn)行格式, 如:粗體 or 斜體.

這些HTML標(biāo)簽被稱為格式化標(biāo)簽(請(qǐng)查看底部完整標(biāo)簽參考手冊(cè))赋朦。

通常標(biāo)簽 <strong> 替換加粗標(biāo)簽 <b> 來(lái)使用, <em> 替換 <i>標(biāo)簽使用。

然而倡勇,這些標(biāo)簽的含義是不同的:

  • <b><i> 定義粗體或斜體文本翁锡。
  • <strong> 或者 <em>意味著你要呈現(xiàn)的文本是重要的酷鸦,所以要突出顯示。現(xiàn)今所有主要瀏覽器都能渲染各種效果的字體于样。不過(guò)挪圾,未來(lái)瀏覽器可能會(huì)支持更好的渲染效果。

實(shí)例


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

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥(niǎo)教程(runoob.com)</title>
</head>

<body>

<b>這個(gè)文本是加粗的</b>

<br />

<strong>這個(gè)文本是加粗的</strong>

<br />

<big>這個(gè)文本字體放大</big>

<br />

<em>這個(gè)文本是斜體的</em>

<br />

<i>這個(gè)文本是斜體的</i>

<br />

<small>這個(gè)文本是縮小的</small>

<br />

這個(gè)文本包含
<sub>下標(biāo)</sub>

<br />

這個(gè)文本包含
<sup>上標(biāo)</sup>

</body>
</html>
此例演示如何使用 pre 標(biāo)簽對(duì)空行和空格進(jìn)行控制

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<pre>
此例演示如何使用 pre 標(biāo)簽
對(duì)空行和    空格
進(jìn)行控制
</pre>

</body>
</html>
此例演示不同的"計(jì)算機(jī)輸出"標(biāo)簽的顯示效果

<!DOCTYPE html> 
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<code>計(jì)算機(jī)輸出</code>
<br />
<kbd>鍵盤(pán)輸入</kbd>
<br />
<tt>打字機(jī)文本</tt>
<br />
<samp>計(jì)算機(jī)代碼樣本</samp>
<br />
<var>計(jì)算機(jī)變量</var>
<br />

<p>
<b>注釋:</b>這些標(biāo)簽常用于顯示計(jì)算機(jī)/編程代碼降淮。
</p>

</body>
</html>
此例演示如何在 HTML 文件中寫(xiě)地址

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<address>
Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br> 
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>

</body>
</html>
此例演示如何實(shí)現(xiàn)縮寫(xiě)或首字母縮寫(xiě)

<!DOCTYPE html> 
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<abbr title="etcetera">etc.</abbr>
<br />
<acronym title="World Wide Web">WWW</acronym>

<p>在某些瀏覽器中超埋,當(dāng)您把鼠標(biāo)移至縮略詞語(yǔ)上時(shí),title 可用于展示表達(dá)的完整版本佳鳖。</p>

<p>僅對(duì)于 IE 5 中的 acronym 元素有效纳本。</p>

<p>對(duì)于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。</p>

</body>
</html>
此例演示如何改變文字的方向

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head> 
<body>

<p>該段落文字從左到右顯示腋颠。</p>  
<p><bdo dir="rtl">該段落文字從右到左顯示。</bdo></p>  

</body>
</html>
此例演示如何實(shí)現(xiàn)長(zhǎng)短不一的引用語(yǔ)

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<p>WWF's goal is to: 
<q>Build a future where people live in harmony with nature.</q>
We hope they succeed.</p>

</body>
</html>
此例演示如何標(biāo)記刪除文本和插入文本

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鳥(niǎo)教程(runoob.com)</title> 
</head>
<body>

<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>

</body>
</html>

HTML 文本格式化標(biāo)簽


文本格式化標(biāo)簽.JPG

HTML "計(jì)算機(jī)輸出" 標(biāo)簽


計(jì)算機(jī)輸出標(biāo)簽.JPG

HTML 引文, 引用, 及標(biāo)簽定義


引文_引用_及標(biāo)簽定義.JPG
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末吓笙,一起剝皮案震驚了整個(gè)濱河市淑玫,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌面睛,老刑警劉巖絮蒿,帶你破解...
    沈念sama閱讀 217,277評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異叁鉴,居然都是意外死亡土涝,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,689評(píng)論 3 393
  • 文/潘曉璐 我一進(jìn)店門幌墓,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)但壮,“玉大人,你說(shuō)我怎么就攤上這事常侣±” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 163,624評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵胳施,是天一觀的道長(zhǎng)溯祸。 經(jīng)常有香客問(wèn)我,道長(zhǎng)舞肆,這世上最難降的妖魔是什么焦辅? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,356評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮椿胯,結(jié)果婚禮上筷登,老公的妹妹穿的比我還像新娘。我一直安慰自己哩盲,他們只是感情好仆抵,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,402評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布跟继。 她就那樣靜靜地躺著,像睡著了一般镣丑。 火紅的嫁衣襯著肌膚如雪舔糖。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 51,292評(píng)論 1 301
  • 那天莺匠,我揣著相機(jī)與錄音金吗,去河邊找鬼。 笑死趣竣,一個(gè)胖子當(dāng)著我的面吹牛摇庙,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播遥缕,決...
    沈念sama閱讀 40,135評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼卫袒,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了单匣?” 一聲冷哼從身側(cè)響起夕凝,我...
    開(kāi)封第一講書(shū)人閱讀 38,992評(píng)論 0 275
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎户秤,沒(méi)想到半個(gè)月后码秉,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,429評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡鸡号,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,636評(píng)論 3 334
  • 正文 我和宋清朗相戀三年转砖,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片鲸伴。...
    茶點(diǎn)故事閱讀 39,785評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡府蔗,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出汞窗,到底是詐尸還是另有隱情礁竞,我是刑警寧澤,帶...
    沈念sama閱讀 35,492評(píng)論 5 345
  • 正文 年R本政府宣布杉辙,位于F島的核電站模捂,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏蜘矢。R本人自食惡果不足惜狂男,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,092評(píng)論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望品腹。 院中可真熱鬧岖食,春花似錦、人聲如沸舞吭。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,723評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至蔑穴,卻和暖如春忠寻,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背存和。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,858評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工奕剃, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人捐腿。 一個(gè)月前我還...
    沈念sama閱讀 47,891評(píng)論 2 370
  • 正文 我出身青樓纵朋,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親茄袖。 傳聞我的和親對(duì)象是個(gè)殘疾皇子操软,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,713評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • HTML 格式化標(biāo)簽HTML 使用標(biāo)簽 與 對(duì)輸出的文本進(jìn)行格式, 如:粗體 or 斜體這些HTML標(biāo)簽被稱為...
    Amy莫莫閱讀 284評(píng)論 0 1
  • 2017-09-06摘抄自W3school-HTML文本格式化希望幫助自己系統(tǒng)地打好基礎(chǔ),也能在做筆記的同時(shí)添加一...
    moralok閱讀 267評(píng)論 0 0
  • 如何查看 HTML 源碼 您是否有過(guò)這樣的經(jīng)歷宪祥,當(dāng)你看到一個(gè)很棒的站點(diǎn)聂薪,你會(huì)很想知道開(kāi)發(fā)人員是如何將它實(shí)現(xiàn)的?你有...
    淺巷墨漓丶閱讀 618評(píng)論 0 0
  • 文本格式化標(biāo)簽 定義粗體文本 定義大字號(hào) 定義著重文字 定義斜體字 定義小字號(hào) 定義加重語(yǔ)氣定義下標(biāo)字定義上標(biāo)字 ...
    csp閱讀 1,003評(píng)論 0 0
  • hiredis的使用 標(biāo)簽(空格分隔): Linux 作業(yè)部落地址:https://www.zybuluo.com...
    別時(shí)茫茫閱讀 34,825評(píng)論 2 17