CSS文字樣式值

2021-10-13 07:16:55 字數 2246 閱讀 7870

字型樣式針對的是「文字本身」的形體效果,而文字樣式針對的是「整個段落」的排版效果。字型樣式注重個體,文字樣式注重整體。常見的文字樣式如下表。

屬性說明

text-indent

首行縮排

text-align

水平對齊

text-decoration

文字修飾

line-height

行高text-transform

大小寫轉換

letter-spacing、word-spacing

字母間距、詞間距

text-indent

p元素的首行是不會自動縮排的,因此我們在html中往往使用6個(空格)來實現首行縮排兩個字的空格。但是這種方式會導致冗餘**很多。因此使用text-indent屬性來定義p元素的首行縮排。

從明天起,做乙個幸福的人,喂馬,劈柴,周遊世界;從明天起,關心糧食和蔬菜,我有一所房子,面朝大海,春暖花開;從明天起,和每乙個親人通訊,告訴他們我的幸福。那幸福的閃電告訴我的,我將告訴每乙個人;給每一條河每一座山取乙個溫暖的名字。陌生人,我也為你祝福,願你有乙個燦爛的前程;願你有情人終成眷屬;願你在塵世獲的幸福;我也願面朝大海,春暖花開。

text-align

使用text-align屬性來控制文字在水平方向上的對齊方式。

text-align屬性值:

我愛學習

我愛學習

我愛學習

text-decoration

使用text-decoration屬性來定義文字的修飾效果(下劃線、中劃線、頂劃線)。text-decoration屬性取值有4個,如下表。

屬性值說明

none

去掉所有劃線效果

underline

下劃線line-through

中劃線overline

頂劃線在html中,可以使用s元素實現中劃線,用u元素實現下劃線。但是有了css之後,都是使用text-decoration屬性來實現。結構用html標籤,外觀一般都要用css。

我愛學習

我愛學習

我愛學習

line-height

可以使用line-height屬性來控制一行文字的高度。

我愛學習

我愛學習

我愛學習

text-transform

可以使用text-transform屬性來將文字進行大小寫轉換。text-transform屬性取值有4個,如下表。

屬性值說明

none

無轉換uppercase

轉換為大寫

lowercase

轉換為小寫

capitalize

只將每個英文單詞首字母大寫

study hard and make progress every day

study hard and make progress every day

study hard and make progress every day

letter-spacing

可以使用letter-spacing屬性來控制字與字之間的距離。每乙個中文漢字都被當作乙個「字」,而每乙個英文本母也被當作乙個「字」。

study hard and make progress every day.好好學習,天天向上

study hard and make progress every day.好好學習,天天向上

study hard and make progress every day.好好學習,天天向上

word-spacing

使用word-spacing屬性來定義兩個單詞之間的距離。一般來說,word-spacing只針對英文單詞而言。

study hard and make progress every day.好好學習,天天向上

study hard and make progress every day.好好學習,天天向上

study hard and make progress every day.好好學習,天天向上

CSS樣式 文字樣式

文字擷取 employorganizalistctrl listtext 文字對齊方式 text align justify 文字超出固定高度 顯示滾動條 overflow scroll 顯示邊框 border 1px dashed ff6b6b 虛線 border top style 1px so...

CSS樣式 文字

css文字屬性可定義文字外觀。通過文字屬性,可以改變文字的顏色,字元間距,對齊文字,裝飾文字,對文字縮排 color aquamarine 顏色是繼承效果 text align center 文字對齊方式 text indent 2 em 首行文字縮排2個畫素 text transform capi...

CSS 文字樣式

left center right左中右 justify 兩端對齊 inherit 繼承 行高不夠時,行與行之間後重疊 數字px 數字em 數字 基於字型大小的百分比 數字 父元素的百分比 數字px 數字em 固定值預設為0 inherit繼承 normal 預設 數字px 固定值 可為負值 inh...