13個常用CSS字體樣式屬性，你知道哪幾個呢？

這篇文章為大家帶來了一些css字體樣式屬性，在設定字體樣式時常用的屬性，希望對大家有幫助。

1. CSS字體樣式屬性

1.1 font-size 字體大小

1. font-size屬性用於設定字號，該屬性的值可以使用相對長度單位，也可以使用絕對長度單位。

   font-size: 14px; // px 绝对像素单位font-size: 1em; // 相对父元素字体大小单位// 注：每个元素必须有字体大小，如果没有申明，则直接使用父元素的字体大小//    如果没有父元素（html）则使用基准字号，基准字号为浏览器里设置的字号

2. 現在網頁中普遍使用14px
3. 盡量使用偶數的數字字號。 ie6等老式瀏覽器支援奇數會有bug。
4. 其中，相對長度單位較常用，建議使用像素單位px，絕對長度單位使用較少。具體如下：

1.2 font-family字體樣式

1. font-family屬性用於設定字體。網頁中常用的字體有宋體、微軟雅黑、黑體等，例如將網頁中所有段落文字的字體設定為微軟雅黑，可以使用如下CSS樣式程式碼：

    p{ 
    	font-family:"微软雅黑";
    }
    // 注: 可以同时指定多个字体，中间以逗号隔开，表示如果浏览器不支持第一个字体，则会尝试下一个，直到找到合适的字体。

2. #各種字體之間必須使用英文狀態的逗號隔開。
3. 中文字體需要加英文狀態下的引號，英文字體一般不需要加引號。當需要設定英文字體時，英文字體名稱必須位於中文字體名之前。
4. 如果字體名稱中包含空格、#、$等符號，則字體必須加英文狀態下的單引號或雙引號，例如font-family: “Times New Roman”;。
5. 盡量使用系統預設字體，確保在任何使用者的瀏覽器中都能正確顯示。
6. 一般網頁中使用的較多的字體為arial，此字體是賈伯斯研發的

1.3 CSS Unicode字體

1. #在CSS 中設定字體名稱，直接寫中文是可以的。但是在檔案編碼（GB2312、UTF-8 等）不符時會產生亂碼的錯誤。 xp 系統不支援 類似微軟雅黑的中文。

2. 方案一： 你可以用英文來取代。如 font-family:「Microsoft Yahei」。

3. 方案二： 在 CSS 直接使用 Unicode 編碼來寫字型名稱可以避免這些錯誤。使用 Unicode 寫文字體名稱，瀏覽器是可以正確的解析的。 font-family: “\5FAE\8F6F\96C5\9ED1”，表示設定字體為“微軟雅黑”。

4. 可以透過escape() 測試屬於什麼字型。

   \6977\4F53_GB2312 \96B6\4E66

   體名	英文名稱	#Unicode 編碼
   宋體	SimSun	\5B8B\4F53
   新宋體	NSimSun	#\65B0\5B8B \4F53
   黑體	SimHei	\9ED1\4F53
   微軟雅黑	Microsoft YaHei	\5FAE\8F6F\96C5\9ED1
   楷體GB2312	KaiTiGB2312	\6977\4F53_GB#KaiTiGB2312
   	隸書	LiSu
   	Y

## YouYuan

\5E7C\5706

華文細黑

STXihei

1. \534E\6587\7EC6\9ED1 細明體MingLiU\7EC6\660E\4F53
2. 註:為了照顧不同電腦的字體安裝問題，我們盡量只用宋體和微軟雅黑中文字體font-weight 字體粗細bstrongCSS 來實現，但是CSS##作用

   		#1.4
   #字體加粗除了用	和	標籤之外，可以使用
   	是沒有語義的。	拓展： strong元素，預設加粗。 strong元素表示重要的不能忽略的內容
   	屬性	屬性值

font-weight:

normal（簡寫400）不加粗

bold（簡寫700）
1. 加粗100~900（100的整數倍）數值越大字體越粗
2. 註：css 數字400 等價於normal，而700 等價於bold。但是我們更喜歡用數字來表示。 1.5 ###font-style### 字體風格#############字體傾斜除了用###i### 和###em# ## 標籤之外，可以使用###CSS### 來實現，但是###CSS### 是沒有語意的。 ######拓展： i元素表達的語言：這一文本為特殊的文本，實際使用的時候通常用它表示一個圖標（icon）############屬性## ####屬性值######作用##################font-style:######normal#######預設值，瀏覽器會顯示標準的字體樣式############italic######瀏覽器會顯示斜體的字體樣式############oblique# #####瀏覽器會顯示傾斜的字體樣式#############

注：平时我们很少给文字加斜体，反而喜欢给斜体标签（em，i）改为普通模式

1.6 font 文字属性速写 (重点)

1. font属性用于对字体样式进行综合设置，其基本语法格式如下：

   选择器{
   	font: font-style font-weight font-size/line-height font-family;}// font:style weight size/行高 字体类型，大小和类型不能省略

2. 使用font属性时，必须按上面语法格式中的顺序书写，不能更换顺序，各个属性以空格隔开。
3. 注意：其中不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性，否则font属性将不起作用。

1.7 letter-spacing 字体间距

1. letter-spacing就是文字与文字间的间距，值可以负数，默认值normal

   p{
   	letter-spacing : 2px;}

1.8 text-decoration 文本修饰：加线

1. line-through：穿过文字，表示中间加条线
2. overline：上面加条线（少用）
3. underline：下面加条线
4. none：表示没有线，去掉线
5. 拓展： del、s元素默认中间加线；del元素表示废弃、错误的内容；s元素表示过期的内容；a元素默认下面加线，表示超链接

1.9 text-indent 首行文本缩进

1. px：缩进多少像素
2. em：缩进几个字体（中英文缩进宽度值一样）

2.0 line-height 文本行高/垂直居中

1. 每行文本的高度，该值越大，每行文本的值越大
2. 设置行高为容器高度，可以让单行文本垂直居中，容器高度为如：height：50px
3. 行高可以设置为纯数字，表示相对于当前元素的字体大小。如取值1.5:行高为文字的1.5倍，这样文字在放大的时候，行高也在变大，不会出现文字重叠现象

2.1 letter-spacing 文字间隙

1. em：每个文字间隔几个字体宽度
2. px：每个文字间隔几个像素

2.2 text-align 文字、行盒、行块盒水平排列方式

1. left：靠左，默认靠左排列
2. center：居中
3. right：靠右

2.3 网页的最小和最大宽度

1. 设置在body元素的css里
2. min-width: 1000px 最小像素
3. max-width: 1500px 最大像素

（学习视频分享：css视频教程）

以上是13個常用CSS字體樣式屬性，你知道哪幾個呢？的詳細內容。更多資訊請關注PHP中文網其他相關文章！