本文創建于2020年9月，以下為正文：

CSS中有哪些字體屬性呢？

font：復合屬性。設置或檢索對象中的文本特征。

font-style：設置或檢索對象中的字體樣式。用于定義字體的風格，如：斜體（italic）等等。

font-variant：設置或檢索對象中的文本是否為小型的大寫字母。

font-weight：設置或檢索對象中的文本字體的粗細。

font-size：設置或檢索對象中的字體尺寸，在開發中12px字體最常用。

font-family ：設置或檢索用于對象中文本的字體名稱序列；用于定義字體的樣式，如黑體，宋體等等。

1.color規定文本的顏色

定義元素內文字顏色

語法：color：顏色名|十六進制|RGB

1>預定義的顏色值，如red,green,blue等。

2>十六進制，如#FF0000，#FF6600等。實際工作中，十六進制是最常用的定義顏色的方式。

3>RGB代碼，如紅色可以表示為rgb（255，0，0）或rgb(100%,0%,0%).

如：

div{color:red;}

div{color:#ff0000;}

div{color:rgb(255,0,0);}

div{color:rgba(255,0,0,.5);}

2.font-style 指定文本的字體樣式（正常、斜體）

該屬性設置使用斜體、傾斜或正常字體。斜體字體通常定義為字體系列中的一個單獨的字體。理論上講，用戶代理可以根據正常字體計算一個斜體字體。

默認值 normal

normal 正常字體

italic 斜體字

p{font-style:italic;}

3.font-size 指定文本字體大小

通過像素來指定字體大小 1px=1像素

font-size：絕對單位|相對單位分別為：px像素|em/%

p{font-size:12px;}

4.font-family定義文本使用某個字體

默認值 由瀏覽器確定

示例：

font-family：Microsoft YaHei;

font-family：“Microsoft YaHei","Simsun”，“SimHei";

5.font-weight 指定文本的粗細

字體加粗除了用b和strong標簽之外，可以使用CSS來實現。

normal：默認值。定義標準的字符。

bold：定義粗體字符

bolder：定義更粗的字符

lighter：定義更細的字符

100~900：定義由粗到細的字符。400等同于normal，而700等同于 old 。

inherit：規定應該從父元素繼承字體的粗細。

設置三個段落的字體的粗細：

p.nomal{font-weight:normal;}

p.thick{font-weight:bold;}

p.thicker{font-weight:900;}

6.letter-spacing

設置字的間距(增加或減少)

該屬性定義了在文本字符框之間插入多少空間。由于字符字形通常比其字符要窄，指定長度值時，會調整字母之間通常的間隔。因此，normal就相當于值為0.

如：div{letter-spacing：2px;}

normal：默認。規定字符間沒有額外的空間。

length：定義字符間的固定空間（允許使用負值）。

inherit：規定應該從父元素繼承letter-spacing屬性的值。

7.opacity

設置顏色的透明度，整個元素都會透明

默認值1，取值為0-1

1為不透明，0為完全透明

示例：

p{opacity：0；}

隱藏一個元素，完全不顯示，但是會占空間，只是看不到

p{opacity:1;}

顯示一個元素 它和rgba中的”a“作用一樣

8.overflow：hidden|auto|scroll

當內容溢出元素框時隱藏|自動|顯示滾動條

visible：默認值。內容不會被修剪，會呈現在元素框之外。

hidden：內容會被修剪，并且其余內容是不可見的。

scroll：內容會被修剪，但是瀏覽器會顯示滾動條以便查看其余的內容。

auto：如果內容被修剪，則瀏覽器會顯示滾動條以便查看其余內容。

inherit：規定應該從父元素繼承overflow屬性的值。

設置overflow屬性代碼：

div

{

width：150px;

height:150px;

overflow:scroll;

}

9.text-overflow

讓溢出的文字以省略號顯示

p{height:20px; width:100px;background:#ddd;}

width-space：nowrap; 讓文字在同一行顯示，不換行

overflow：hidden； 溢出部分隱藏

text-overflow：ellipsis； 文字一處部分省略號顯示，另外一個值為clip

（ps:如果您覺得有用，請點贊轉發，讓更多人看到哦）

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的background复合属性顺序_CSS有哪些好用的字体属性？的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。