css3字型樣式

一、font-family的使用

font-family屬性可以設定html文字的字型樣式，

eg.*

注意：當字型名稱中包括空格、#、$之類的符號，則使用''

font-family 可以把多個字型名稱作為乙個「回退」系統來儲存。如果瀏覽器不支援第乙個字型，則會嘗試下乙個。

也就是說，font-family 屬性的值是用於某個元素的字型族名稱或/及類族名稱的乙個優先表。瀏覽器會使用它可

識別的第乙個值。

上面的font-family若系統都無法找到，則會使用系統預設的font-family樣式，從而影響了樣式顯示。你可以設定

伺服器端樣式，即在伺服器中匯入字型樣式包，然後通過css匯入該包，並使font-family引用。

1、字型包的匯入

想使用的字型包，並將它貼上到css所在的資料夾，如msyh.ttf（微軟雅黑的檔案）。

2、css中使用字型包

css引用字型包

@font-face

css中使用

*可以使用這種方式使用特殊的英文本型樣式，但是由於中文的字型包比較大，所以不建議使用上面的導包方法。

二、text-shadow   [ˈʃædoʊ]    文字新增陰影

eg. p

解釋：給文字新增陰影。其中四個值，第乙個值：水平偏移；第二個值：垂直偏移；第三個值：陰影模糊度（可選）；

第四個值：陰影顏色（可選）。

雖然後兩個值是可選，但要寫上，否則文字會疊加，非常難看。若果最後的字型顏色不寫，那麼陰影的顏色便是字型

的顏色。

三、white-space      css2

normal             預設。空白符被壓縮，文字自動換行

pre             空白符被保留，遇到換行符（換行符即為【enter】鍵）則換行。其行為方式類似 html 中的標籤。

nowrap             空白符被壓縮，文字不換行，直到遇到

標籤為止。

pre-wrap     空白符被保留，文字會在排滿或遇換行符換行。

pre-line     空白符被壓縮，文字會在排滿或遇換行符換行。

inherit     規定應該從父元素繼承 white-space 屬性的值。

word-wrap        讓過長的英文單詞斷開

eg. p

normal           單詞不斷開

break-word       斷開單詞

CSS3 字型樣式

lang en charset utf 8 css3的其他屬性title type text css font face 宣告使用伺服器端字型 伺服器端字型對otf和ttf這兩種字型格式支援良好 font face p box sizing 設定width和height屬性值包含的內容。div di...

前端CSS3 字型樣式

一 font family設定字型 sans serif是專指西文中沒有襯線的字型 例如 為網頁中的文字設定字型為 宋體 text css body 或body style 二 font size設定字型大小 例如 設定網頁中文字的字型大小為12畫素。text css body style 三 fo...

CSS3字型樣式和文字樣式

body body body 上面比這種方法相容性更好一些。bodyp span 粗體樣式 box1 color的值有3種設定方式 p每一項的值可以是 0 255 之間的整數，也可以是 0 100 的百分數。p p這種顏色設定方法是現在比較普遍使用的方法.pbody 可以簡寫為 body 1 使用這...