十二:文本標(biāo)簽及文本樣式

1.<em>和<strong>標(biāo)簽

em 標(biāo)簽用于表示一段內(nèi)容中的著重點(diǎn)
strong標(biāo)簽用于表示一個(gè)內(nèi)容的重要性
這兩個(gè)標(biāo)簽可以單獨(dú)使用,也可以一起使用
通常em顯示為斜體,而strong顯示為粗體

2.<i>和<b>標(biāo)簽

i標(biāo)簽會(huì)使文字變成斜體
b標(biāo)簽會(huì)使文字變成粗體
這兩個(gè)標(biāo)簽和em和strong類似,但是這兩個(gè)標(biāo)簽沒有語義

3.<small>標(biāo)簽

small標(biāo)簽表示細(xì)則一類的旁注,通常包括負(fù)責(zé)聲明,注意事項(xiàng),法律限制,版權(quán)信息
瀏覽器在顯示small標(biāo)簽時(shí)會(huì)顯示一個(gè)比父元素小的字號(hào)

4.<cite>標(biāo)簽

使用cite標(biāo)簽可以指明對(duì)某內(nèi)容的引用或參考

5.<blockquote>和<q>標(biāo)簽

blockquote和q表示標(biāo)記引用的文本
block用于長(zhǎng)引用,q用于短引用
在兩個(gè)標(biāo)簽中還可以使用cite屬性來表示引用的地址

6.標(biāo)簽

sup和sub用于定義上標(biāo)和下標(biāo)
上標(biāo)主要用于表示類似于10的3次方中的3
下標(biāo)則用于表示類似于H2O中的2

7.<ins>和<del>標(biāo)簽

ins表示插入的內(nèi)容,顯示時(shí)通常會(huì)加上下劃線
del表示刪除的內(nèi)容,顯示時(shí)通常會(huì)加上刪除線

8.<code>和<pre>標(biāo)簽

如果你的內(nèi)容包含示例或文件名,就可以使用code元素
pre元素表示的是預(yù)格式化文本,可以使用
pre包住code來表示一段代碼

9.有序列表
使用ol和li來創(chuàng)建一個(gè)有序列表
<ol>

10.無序列表

使用ul和li來創(chuàng)建一個(gè)無序列表

11.定義列表

使用dl.dd.dt來創(chuàng)建一個(gè)定義列表

12.文本格式化
單位:px
如果我們將一個(gè)圖片放大的話,我們會(huì)發(fā)現(xiàn)一個(gè)圖片是有一個(gè)一個(gè)的小色塊塊構(gòu)成的,這一個(gè)小色塊就是一個(gè)像素,也就是1px,對(duì)于不同的顯示器來說一個(gè)像素的大小 是不同的

百分比:
也可以使用一個(gè)百分?jǐn)?shù)來表示一個(gè)大小,百分比是相對(duì)于父元素來說的

em:
em和百分比類似,也是相對(duì)于父元素說的

13.字體
通過font-family可以指定標(biāo)簽中文字使用的字體

font-size用來指定文字的大小

通過font-familyk可以同時(shí)指定多個(gè)字體

14.字體分類
serif (襯線字體)

sans-serif( 非襯托線字
體)
monospace(等寬字體)

cursive(草書字體)

fantasy(虛幻字體)
以上這些分類都是一些大的分類,并沒有涉及具體的類型,如果將字體指定為這些格式,瀏覽器會(huì)自己選擇指定類型的字體

15.協(xié)體和粗體

font-style用來指定文本的斜體
-指定斜體:font-style:italic
-指定非斜體:font-style:normal
font-weight用來指定文本的粗體
-指定粗體:font-weight:bold
-指定非粗體:font-weight:normal

16.小型大寫字母
font-variant屬性可以將字母類型設(shè)置為小 型大寫,在該樣式中,字母看起來像是稍微縮小了尺寸的大寫字母
-font-variant:small-caps

17.字體屬性的簡(jiǎn)寫
font可以一次性同時(shí)設(shè)置多個(gè)字體的樣式
語法:
-font:加粗 斜體 小型大寫 大小/行高 字體
這里前邊幾個(gè)加粗,斜體和小型大寫的順序無所謂,也可以不寫,但是大小和字體必須寫且必須寫到后兩個(gè)

18.行間距
link-height用于設(shè)置行高,行高越大則行間距越大
行間距 = link-height - font-size

19.大寫化
text-transform樣式用于將元素中的字母全都變成大寫
-大寫:text-transform:uppercase
-小寫:text-tansform:lowercase
-首字母大寫:text-transform:capitalize
-正常:text-transform:none

20.文本的修飾
text-decoration屬性,用來給文本添加各種修飾,通過它可以為文本的上方,下方 或者中間添加線條
可選值:
-underline
-overline
-line-through
-none

21.字母間距和單詞間距

letter-spacing用來設(shè)置字符之間的間距
word-spacing用來設(shè)置單詞之間的間距
這兩個(gè)屬性都可以直接指定一個(gè)長(zhǎng)度或百分?jǐn)?shù)作為值,正數(shù)代表的是增加距離,而負(fù)數(shù)代表減少距離

22.對(duì)齊文本
text-align用于設(shè)置文本的對(duì)齊方式
-left: 左對(duì)齊
-right: 右對(duì)齊
-justifg: 兩邊對(duì)齊
-center: 居中對(duì)齊

23.首行縮進(jìn)

text-indent用來設(shè)置首行縮進(jìn)
該樣式需要指定一個(gè)長(zhǎng)度,并且只對(duì)第一行生效

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • HTML標(biāo)簽解釋大全 一、HTML標(biāo)記 標(biāo)簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,539評(píng)論 1 41
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,193評(píng)論 1 92
  • 序言 整理谷歌的小弟的筆記,版權(quán)歸原作者所有,本文僅作整理,原文鏈接:http://blog.csdn.net/l...
    在代碼下成長(zhǎng)閱讀 1,339評(píng)論 1 5
  • 最近幾年,全國(guó)范圍內(nèi)的學(xué)生合唱團(tuán),發(fā)展的勢(shì)頭很猛,很多學(xué)校都建立了常備的合唱團(tuán),并且能夠保持持續(xù)的排練活動(dòng)。國(guó)內(nèi)外...
    雒渭閱讀 1,207評(píng)論 0 2
  • 嬌小女生穿闊腿褲,可能沒有大長(zhǎng)腿的天生優(yōu)勢(shì),但并不意味著她們不能穿,闊腿褲向來很小眾,但在今年夏天,小眾的闊腿褲也...
    拍范閱讀 572評(píng)論 0 0

友情鏈接更多精彩內(nèi)容