HTML5基礎----文字特效

一.文字特效
1. 設置字體樣式

font-family:”字體類型”;
注意:直接寫對應的英文就不要引號

2. 設置字體大小

font-size:數值px;
常用的單位:px pt em

3. 設置字體風格

font-style:normal/italic(傾斜)/oblique(傾斜);

4. 設置字體粗細

font-weight:100-900/bold/bolder/lighter

5. 設置字體顏色

color:顏色;

6. 複合屬性

font:字體風格或粗細 字體大小 字體類型;

二.文本屬性
1. 單詞間隔

word-spacing:數值px;

2. 字符間隔

letter-spacing:數值px;

3. 文本修飾

text-decoration:none(沒有線)/underline(下劃線)/overline(上劃線)/line-through(刪除線)

4.縱向排列

vertical-align:
參數 說明
baseline 使元素和上級元素的基線對齊
sub 下標
super 上標
top 使元素和行中最多的元素向上對齊
text-top 使元素和上級元素的字體向上對齊
bottom 使元素和行中最低的元素向下對齊
middle 縱向對齊元素基線加上級元素的高度的一半的中點
text-bottom 使元素和上級元素的字體向下對齊
百分比 是一個相對於元素行高的百分比,它會在上級基線上增高元素基線的指定的數量。此處允許使用負值,負值表示減少相應的數量

5.文本排列

text-align:left/right/center;

6.文本縮進

text-indent:數值px/em/pt/百分比;

7. 行高

line-height:數值px/em/pt;

8. 空白處理

參數 說明
normal 是默認屬性,即將連續的多個空格合併
pre 用等寬字體顯示預先格式化的文本,不合並文字間的空白距離,當文字超出邊界時不換行
nowrap 表示強制在同一行內顯示所有文本,直到文本結束或遇到br標籤
pre-wrap 用等寬字體顯示預先格式化的文本,不合並文字間的空白距離,當文字碰到邊界時發生換行
pre-line 保持文本的換行,不保留文字間的空白距離,當文字碰到邊界時發生換行

9. 文本反排

unicode-bidi:bidi-override;
direction:ltr/rtl;

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章