css怎么設置漂亮的中文字體樣式

CSS即使設置了其他字體，也要看別的電腦里有沒有，一般系統自帶有宋體，黑體等字體，但是如果你電腦上有好看的字體，可以顯示，在別的電腦沒有你的字體，就顯示不了，所以一般只會設置系統自帶的字體。

網站建設哪家好，找成都創新互聯！專注于網頁設計、網站建設、微信開發、小程序制作、集團企業網站建設等服務項目。為回饋新老客戶創新互聯還提供了金川免費建站歡迎大家使用！

設置方法：

html

head

style type="text/css"

p.ziti{font-family:"Times New Roman",Georgia,Serif}

/style

/head

body

h1CSS font-family/h1

p class="ziti"要更改的字體內容/p

/body

/html

CSS定義可以是：font-family:sans-serif

也就是CSS用 p{font-family:"Times New Roman",Georgia,Serif}

為什么我這里設置了三個，分別用","隔開呢，因為不同版本的操作系統，對字體的支持不同解釋如下：

例如微軟雅黑不同操作系統不同版本需要如下設置：

Windows XP及以前版本的Windows

font-family: Arial, 宋體, sans-serif;

Windows Vista和Windows 7

font-family: 'Microsoft Yahei', sans-serif;

Sorry，英文就無法設置字體了，因為中文字體都包含了英文字體。好在雅黑顯示英文還湊合。

Mac及其它操作系統

font-family: sans-serif;

系統自帶中文字體編碼：

宋體SimSun黑體SimHei微軟雅黑Microsoft YaHei微軟正黑體Microsoft JhengHei新宋體NSimSun新細明體PMingLiU細明體MingLiU標楷體DFKai-SB仿宋FangSong楷體KaiTi仿宋_GB2312FangSong_GB2312楷體_GB2312KaiTi_GB2312

CSS字體與文本樣式詳解

學習導航

1、css中的長度與顏色

2、css中的文字屬性

3、css中的文本屬性

1、文字樣式屬性

font-family 字體屬性

作用：元素內文字以什么字體來顯示

語法：font-family:[字體1],[字體2],[......];

說明：含空格字體名和中文，用英文引號（"）括起；多個字體用英文逗號隔開；引號嵌套，外使用雙引號，內使用單引號。

font-size 文字大小

作用：元素內文字大小

語法：font-size:絕對單單位，相相對單位

color 文字顏色

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

font-weight 文字粗細

語法：font-weight:normal 正常 | bold 加粗 | bolder 加粗 | lighter 細體 | 100-900

說明：默認值：normal 400等同于normal,而700等同于bold

font-style 文字樣式

作用：為元素內文字設置樣式

語法：font-style:normal 正常顯示 | italic 文字傾斜 | oblique 文字傾斜（基本不用）

font-variant 字體變形

作用：設置元素中文本為小型大寫字母

語法：font-variant:normal 正常顯示| small-caps 將英文大小寫字母調成為同寬

font 屬性簡寫

語法：font:font-style font-variant ?font-weight font-size/line-height font-family;

說明：值之間空格隔開，注意書寫順序。

2、CSS文本樣式

text-align

作用：設置元素內文本的水平對齊方式

語法：tex-align:left 左對齊?| right 右對齊 | center 居中對齊 | justify 兩端對齊

注意：該屬性對塊級元素設置有效

line-height

作用：設置元素中文本行高

語法：line-height:長度值 | 百分比

說明：一行文字的高度，行高指文本行的基線間的距離

文字基線

注意：基線并不是漢字文字的下沿，看圖理解自行理解

行高和行距

行高：基線到基線的距離

行距：底線到頂線的距離

注意：看圖自行理解

行框和行內框

注意：看圖自行理解

vertical-align

作用：設置元素內容的垂直方式

語法：vertical-align:baseline | sub | super | top | text-top | middle | bottom | text-bottom |?長度 | 百分比

注意：看圖自行理解

text-indent 首行縮進

3、文本樣式屬性

text-transform:?capitzlize?首字母大寫 |?uppercase?字母大寫?|?lowercase? 字母小寫 |?none 正常

text-decoration:?underline?下劃線 |?overline 上劃線?|?line-through?刪除線 | none 正常

綜合實操案例

如果您覺得有用，記得在下方點贊、關注、留言，我會定期奉 上更多的驚喜哦，您的打賞支持才是我繼續努力的動力，么么噠。

每日分享在學習過程中總結的學習經驗，學習筆記，筆試題，HTML，CSS，JavaScript，jQuery教程，Vue教程，PHP教程，TinkPHP教程等，望大家能以學習為目的，每天閱讀一篇文章，了解身邊的技術。陪有夢想的人一起成長！

css好看的字體樣式

style type="text/css"

.aa{ width:200px; height:44px; border:0; background-image:url(img1.png); }

.aa:active{ background-image:url(img2.png);}

/style

input type="button" class="aa" value=""/

IE6需要另外插一張類庫

CSS樣式都有哪幾種?

大小 font-size: x-large;(特大) xx-small;(極小) 一般中文用不到，只要用數值就可以，單位：PX、PD、em等

樣式 font-style: oblique;(偏斜體) italic;(斜體) normal;(正常)

行高 line-height: normal;(正常) 單位：PX、PD、EM

粗細 font-weight: bold;(粗體) lighter;(細體) normal;(正常)

色彩background-color: #FFFFFF;

圖片background-image: url();border-style: dotted;(點線) dashed;(虛線) solid;(實線) double;(雙線) groove;(凹槽) ridge;(脊狀) inset;(邊框) outset;(邊框)

類型list-style-type: disc;(圓點) circle;(圓圈) square;(方塊) decimal;(數字) none(無)text-align:right; /*文字右對齊*/

text-align:left; /*文字左對齊*/

text-align:center; /*文字居中對齊*/

text-align:justify; /*文字分散對齊*/

vertical-align屬性

vertical-align:top; /*垂直向上對齊*/

vertical-align:bottom; /*垂直向下對齊*/

vertical-align:middle; /*垂直居中對齊*/

vertical-align:text-top; /*文字垂直向上對齊*/

vertical-align:text-bottom; /*文字垂直向下對齊*/這些都是比較常用的如果你要把樣式做的很漂亮這些還是不夠的自己去看看文檔吧慢慢學習

font family字體有哪些，求全一點的，最好圖文結合。（CSS中用的）

一些常用的font-family包括：

font-family:?"微軟雅黑","華文細黑",Arial,?Helvetica,?sans-serif;font-family:"宋體",?"Times?New?Roman",?Times,?serif;font-faily:"華文細黑",Courier?New,?Courier,?monospacefont-family:?"華文仿宋",Georgia,?"Times?New?Roman",?Times,?serif;font-family:"黑體",?Verdana,?Arial,?Helvetica,?sans-serif;font-family:"方正姚體",?Geneva,?Arial,?Helvetica,?sans-serif;

微軟雅黑是windows?vista的默認字體，對windows?xp用戶來說，把它放在“華文細黑”或者“宋體”之前是不錯的主意，可以讓windows?xp用戶也體驗到微軟雅興黑字體的漂亮，前提是客戶端也安裝了雅黑字體。

部分字體截圖如下：

css字體樣式有哪些

非常多，可以設置系統中的任何一種字體樣式，Windows自帶中文字體：宋體、黑體、楷體(GB2312)、仿宋(GB2312)、微軟雅黑等。

Windows自帶英文字體：Arial、Verdana、 Geneva、 sans-seri、Times等。

網頁題目：css好看的字體樣式大全,css好看的字體樣式大全下載
當前URL：http://vcdvsql.cn/article46/dsiepeg.html

成都網站建設公司_創新互聯，為您提供網站策劃、網站導航、、商城網站、虛擬主機、網站收錄

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯