css文字行高是哪個屬性 CSS 文字樣式

2021-10-14 06:09:39 字數 2805 閱讀 7009

本節我們講文字樣式,像比如設定文字顏色呀,首行縮排、水平對齊等,可以對網頁進行排本設定等。

將要學習的文字屬性有如下幾個:

首先我們來講文字顏色設定,前面我們講過一節關於如何設定顏色,所以想必大家對如何給文字設定顏色不會。

示例:

例如給下面的

標籤中的 標籤中的文字,顏色設定為粉色:

盛年不重來,一日難再晨。及時宜自勉,歲月不待人。css 樣式**:

span
或者使用十六進製制顏色值:

span
一般我們在寫作文的時候,所有段落的首行都會首行縮排兩個字,而我們如果希望在網頁中的段落也能實現首行縮排呢,這就可以通過 css 中的 text-index 屬性來設定首行文字的縮排。

text-index 屬性直接將縮排距離以數字表示,單位為 em 或 px。一般我們使用 em 更多,通常將值設定為 2em,表示縮排兩個字元。

em 是相對單位,表示的長度相當於文字中字元的倍數,會根據字元的大小,自動適應,空出設定字元的倍數。

text-index 屬性允許使用負值,如果使用負值,那麼首行會被縮排到左邊。

示例:

實現第乙個段落和最後乙個段落的首行縮排:

css學習(9xkd.com)
蒹葭蒼蒼,白露為霜。所謂伊人,在水一方。溯洄從之,道阻且長。溯游從之,宛在水**。蒹葭萋萋,白露未晞。所謂伊人,在水之湄。溯洄從之,道阻且躋。溯游從之,宛在水中坻。

蒹葭採採,白露未已。所謂伊人,在水之涘。

溯洄從之,道阻且右。溯游從之,宛在水中沚。

css 樣式**:

.index
在瀏覽器中的演示:

text-align 屬性用於設定元素中文字的水平對齊方式。

屬性值有下面幾種:

示例:

看一下不同屬性值能實現的效果:

css學習(9xkd.com)
內容居中內容居左內容居右內容不新增樣式

css 樣式**:

.text1.text2.text3
在瀏覽器中的演示:

line-height 用於設定行高,也就是設定行間的距離。

屬性值可以是下面幾種:

一般我們使用數字來表示,單位為 px,如果不新增單位,則表示按倍數表示,這時行高是字型大小的倍數。

示例:

例如下面第乙個

標籤中的內容字型大小為14px,將行高設定為 21px,和將行高設定為 2(字型大小的兩倍) 是一樣的效果:

魯迅的成功,有乙個重要的秘訣,就是珍惜時間。魯迅十二歲在紹興城讀私塾的時候,父親正患著重病,兩個弟弟年紀尚幼,魯迅不僅經常上當鋪,跑藥店,還得幫助母親做家務,為免影響學業,他必須作好精確的時間安排。此後,魯迅幾乎每天都在擠時間。他說過:「時間,就像海綿裡的水,只要你擠,總是有的。」魯迅讀書的興趣十分廣泛,又喜歡寫作,他對於民間藝術,特別是傳說、繪畫,也深切愛好。css 樣式**:

.text
在瀏覽器中的演示:

text-decoration 屬性用於設定文字的裝飾,也就是給文字設定某種效果,例如下劃線、刪除線等。

屬性值可以是下面幾種:

示例:

預設文字設定下劃線設定上劃線設定刪除線

文字閃爍

去掉鏈結的下劃線css 樣式**:

.p1.p2.p3.p4a
在瀏覽器中的演示:

CSS 文字行(總結筆記)

1 什麼是行高?行高指文字基線間的垂直距離,行高在數值上等於字型大小 行距。行高是可繼承的line height 是可以繼承的。父元素不同的行高單位影響子元素的繼承 父元素的行高為 24px 時,子元素直接繼承此固定的行高 父元素的行高為 150 或 1.5em 時,會根據父元素的字型大小先計算出行...

css文字屬性 文字轉換(CSS屬性)

css文字屬性 text transform 文字轉換 繼承 this property controls if and how an element s text content is capitalized.此屬性控制是否以及如何大寫元素的文字內容。these style rules makeh...

CSS文字屬性

一 可以被繼承的屬性 font size font family font weight font style line height color text align text indent 二 文字大小 屬性值為數值型,必須給屬性值加單位,屬性值為0時除外。單位可以是pt px em 9pt 1...