文本樣式可以控制文本的字體、字號、顏色等常規屬性
文本樣式甚至還可以取代加粗、傾斜等HTML元素
文本顏色color
color屬性設置文本顏色
color屬性的語法結構
- color:value;
p{ color: red; }
字體font-family
font-family設置文本字體
font-family:value,value,...
當字體名中有一個或多個空格(比如New York),或者如果字體名包含#或$之類的符號,需要在font-family聲明中加引號
font-family:"宋體",Arial;
字號font-size
font-size屬性設置字號
font-size屬性的語法結構:
- font-size:value;
標題字號:20~24px
正文字號:12px~14px
文本加粗font-weight
font-weight屬性設置文本的粗細
font-weight屬性的語法結構
- font-weight:normal|bold|100~900;
- 400相當於normal
- 700相當於bold
文本風格font-style
font-style屬性定義字體的風格
font-style屬性的語法結構:
- font-style:normal|italic
字符轉換text-transform
text-transform屬性控制文本的大小寫
text-transform屬性的語法結構:
- text-transfrom:none|capitalize|uppercase|lowercase;
行高line-height
line-height屬性設置行高
line-height屬性的語法結構
- line-height:value;
修飾線text-decoration
text-decoration屬性設置文本的修飾線
text-decoration屬性的語法結構:
text-decoration:none|underlin|line-through|overline;
水平對齊text-align
text-align屬性設置文本的水平對齊方式
text-align屬性的語法結構
- text-algin:left|center|right|justify;
首行縮進text-indent
text-indent屬性設置文本塊中首行文本的縮進
允許使用負值。如果使用負值,那麼首行會被縮進到左邊
text-indent屬性的語法結構:
- text-indent:value;