文本屬性和字體屬性

文本屬性

        文本對齊                 

#中心對齊
text-align: center

#兩端對齊(只限於英文)
text-align: justify

#左對齊
text-align: left

#右對齊
text-align: right

        注意 : 當給文本垂直居中時,要將標籤轉塊級標籤或者行內塊標籤,設置寬高.

          文 本首行縮進          

#首行縮進
text-indent: 2em

#####在文本中,默認字體大小爲 16px , 1 em = 16 px

      文本修飾          

#文本修飾

#默認
text-decoration: none;  (,沒有線)
3有下劃線
text-decoration: underline;
#定義文本上的一條線
text-decoration: overline;
#定義穿過文本下的一條線
text-decoration: line-through;
#繼承父元素的text-decoration屬性
text-decoration: inherit

      行高    line-height        

#行高:指的是一行的高度

#單行文本垂直居中： line-height =  height

#多行文本居中：行高的高度不能小於字體的大小，否則上下字之間會緊挨一塊兒。



#想要居中 ,示例
第一步，一個寬度300*300的盒子，看盒子中一共顯示了幾行文字，假如是5行，再看一下行高，若是行高是line-height:30px; 那麼就知道行高*5=150px

第二步，讓(盒子的高度-150px)/2=75;那麼設置盒子的padding-top:75px;同時保證盒子的高度爲300px,那麼高度改成225px;

 

字體屬性

     字體大小            

#字體大小

font-size: 12px;

#若是設置成 inherit 表示繼承父元素的字體大小值

       字體粗細        

#默認,字體粗細
font-weight: none;

#粗體
font-weight: bold;

#更粗
font-weight: border;

#更細
font-weight: lighter;

#繼承父元素字體的粗細值
|inherit

#100~900(設置具體粗細，400等同於normal，而700等同於bold）

        字體系列          

font-family: "Microsoft Yahei", "微軟雅黑", "Arial", sans-serif

#若是瀏覽器不支持第一個字體，則會嘗試下一個。瀏覽器會使用它可識別的第一個值。若是都不支持則顯示宋體。
#若是兩個同樣字體,以英文優先

 

使用font-family注意幾點：

1.網頁中不是全部字體都能用哦，由於這個字體要看用戶的電腦裏面裝沒裝，
好比你設置： font-family: "華文彩雲"; 若是用戶電腦裏面沒有這個字體，
那麼就會變成宋體
頁面中，中文咱們只使用： 微軟雅黑、宋體、黑體。 
若是頁面中，須要其餘的字體，那麼須要切圖。 英語：Arial 、 Times New Roman

2.爲了防止用戶電腦裏面，沒有微軟雅黑這個字體。
就要用英語的逗號，隔開備選字體，就是說若是用戶電腦裏面，
沒有安裝微軟雅黑字體，那麼就是宋體：
font-family: "微軟雅黑","宋體"; 備選字體能夠有無數個，用逗號隔開。
3.咱們要將英語字體，放在最前面，這樣全部的中文，就不能匹配英語字體，
就自動的變爲後面的中文字體： 
font-family: "Times New Roman","微軟雅黑","宋體";

4.全部的中文字體，都有英語別名，
咱們也要知道： 微軟雅黑的英語別名：
font-family: "Microsoft YaHei";
宋體的英語別名： font-family: "SimSun";
font屬性可以將font-size、line-height、font-family合三爲一： font:12px/30px "Times New Roman","Microsoft YaHei","SimSun";

5.行高能夠用百分比，表示字號的百分之多少。
通常來講，都是大於100%的，由於行高必定要大於字號。 
font:12px/200% 「宋體」 等價於 font:12px/24px 「宋體」; 
反過來，好比： font:16px/48px 「宋體」;
等價於 font:16px/300% 「宋體」