怎么在CSS中定義字體、顏色、背景等屬性

本篇文章為大家展示了怎么在CSS中定義字體、顏色、背景等屬性，內(nèi)容簡(jiǎn)明扼要并且容易理解，絕對(duì)能使你眼前一亮，通過這篇文章的詳細(xì)介紹希望你能有所收獲。

創(chuàng)新互聯(lián)堅(jiān)持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都做網(wǎng)站、網(wǎng)站設(shè)計(jì)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時(shí)代的內(nèi)丘網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

•字體屬性

•字體font-family:"字體1","字體2",...    例：font-family：“宋體”;
•字號(hào)font-size:大小的取值      例：font-size:16px; 注意：xx-small:絕對(duì)字體尺寸，最小。 x-small:絕對(duì)字體尺寸，較小。 medium:絕對(duì)字體尺寸，正常默認(rèn)值。對(duì)應(yīng)還有l(wèi)arge、x-large、xx-large等。larger:相對(duì)字體尺寸，相對(duì)于父對(duì)象中字體尺寸進(jìn)行相對(duì)增大。smaller:相對(duì)字體尺寸，相對(duì)于父對(duì)象中字體尺寸進(jìn)行相對(duì)減小。length:可采用百分比或長(zhǎng)度值，不可為負(fù)值，其百分比取值是基于父對(duì)象中字體的尺寸。
•字體風(fēng)格font-style:樣式的取值  例：font-style:normal   .normal是默認(rèn)的正常字體；italic以斜體顯示文字；oblique屬于中間狀態(tài)，以偏斜體顯示。
•加粗字體font-weight:字體粗細(xì)值  例：font-weight:normal.  其中normal表示正常粗細(xì)；bold表示粗體；bolder表示特粗體；lighter表示特細(xì)體；number不是真正的取值，其范圍是100~900，一般情況下都是整百的數(shù)字，如200、300等。
•小寫字母轉(zhuǎn)化為大寫font-variant:取值  例：font-variant:small-caps;能將小寫的英文字母轉(zhuǎn)化為大寫字母且字體較小。另一個(gè)normal,表示正常顯示。
•CSS中可采用復(fù)合樣式，來簡(jiǎn)化代碼，如：.h{font-family:"宋體"; font-weight:bold; font-style:italic;}

•顏色和背景屬性

•顏色屬性color:顏色取值  例：color:red。 color可以用關(guān)鍵字或者一個(gè)十六進(jìn)制的RGB值。

                     color:#ff0000 表示紅色    color:#ffff00 表示黃色    color:#000099 表示藍(lán)色

                     關(guān)鍵字就是顏色的英文名稱，如red,green,blue,分別表示紅、綠、藍(lán)。
•背景顏色background-color:顏色取值
•背景圖像background-image:url(圖像地址)
•背景重復(fù)background-repeat:取值 . no-repeat表示背景圖像不平鋪；repeat表示背景圖像平鋪排滿整個(gè)網(wǎng)頁；repeat-x表示背景圖像只在水平方向上平鋪；repeat-y表示背景圖像只在垂直方向上平鋪。
•背景附件background-attachment:scroll/fixed   scroll表示背景圖像隨對(duì)象滾動(dòng)而滾動(dòng)，是默認(rèn)選項(xiàng)；fixed表示背景圖像固定在頁面上不動(dòng)，只有其它內(nèi)容隨滾動(dòng)條滾動(dòng)。
•背景位置background-position:位置取值  。一種采用數(shù)字取值，另一種采用關(guān)鍵字描述。如：x,y. left top .
•背景復(fù)合屬性background:url(圖像地址) no-repeat left top;
 

•段落屬性

•單詞間隔word-spacing:取值。默認(rèn)normal;取值可正可負(fù)。
•字符間隔letter-spacing:取值。6px,3px等具體的值
•文字修飾text-decoration:取值。 none表示不修飾，默認(rèn)值；underline表示對(duì)文字添加下劃線；overline表示對(duì)文字添加上劃線；line-through表示對(duì)文字添加刪除線；blink表示文字閃爍效果。
•垂直對(duì)齊方式vertical-align:排列取值  

        baseline:瀏覽器默認(rèn)的垂直對(duì)齊方式。

        sub:文字的下標(biāo)。

        super:文字的上標(biāo)。

        top:垂直靠上對(duì)齊。

        text-top:使元素和上級(jí)元素的字體向上對(duì)齊。

        middle:垂直居中對(duì)齊。

        text-bottom:使元素和上級(jí)元素的字體向下對(duì)齊。

•文本轉(zhuǎn)換text-transform:轉(zhuǎn)換值

          none:表示使用原始值。

          capitalize:表示使每個(gè)單詞的第一個(gè)字母大寫。

          uppercase:表示使每個(gè)單詞的所有字母大寫。

          lowercase:表示使每個(gè)單詞的所有字母小寫。

•水平對(duì)齊方式text-align:排列值。

            left:左對(duì)齊。

            right:右對(duì)齊。

            center:居中對(duì)齊。

            justify:兩端對(duì)齊。

•文本縮進(jìn)text-ident:縮進(jìn)值。取值為：長(zhǎng)度值或者百分比。
•文本行高line-height:行高值。取值為：長(zhǎng)度、倍數(shù)或百分比。
&bull;處理空白white-space:值。normal是默認(rèn)值，即將連續(xù)的多個(gè)空格合并；pre會(huì)導(dǎo)致源代碼中的空格和換行符被保留，但這一選項(xiàng)只有在IE6中才能正確顯示；nowrap強(qiáng)制在同一行內(nèi)顯示所有文本，直到文本結(jié)束或者遇到換行（<br>）對(duì)象。
&bull;文本反排unicode-bidi:bidi-override | normal |embed    override表示嚴(yán)格按照direction屬性的值重排序；normal表示為默認(rèn)值；embed表示對(duì)象打開附加的嵌入層。 &bull;direction:ltr | rtl |inherit             ltr表示從左到右順序閱讀；rtl表示從右到左順序閱讀；inherit表示文本流的值不可繼承。 

&bull;外邊框與內(nèi)邊距屬性 &bull;內(nèi)容區(qū) 通過width , height ,overflow調(diào)整
&bull;內(nèi)邊距通過padding-top,padding-bottom,padding-left,padding-right調(diào)整
&bull;邊框通過border-style,border-width,border-color調(diào)整
&bull;外邊框通過margin-left,margin-right,margin-top,margin-bottom調(diào)整

&bull;復(fù)合屬性margin:長(zhǎng)度值 | 百分比 | auto    可以取1~4個(gè)值 &bull; {margin:10px 20px 10px 10px}代表上,下,左,右分別是10px,20px,10px,10px
&bull;{margin:10px 20px 30px}.上邊距是10px,左右邊距是20px,下邊距是30px
&bull; {margin:10px 20px}代表上下邊距是10px,左右邊距是20px
&bull;{margin:10px} 代表所有邊距都是10px

&bull;邊框?qū)傩?/strong>

&bull; 邊框樣式語法 &bull;border-style:樣式值
&bull;border-top-style:樣式值
&bull;border-right-style:樣式值
&bull;border-left-style:樣式值
&bull;border-bottom-style:樣式值

&bull;邊框樣式的取值和含義

css的全稱是什么

css的全稱是Cascading Style Sheets（層疊樣式表），它是一種用來表現(xiàn)HTML或XML等文件樣式的計(jì)算機(jī)語言。CSS不僅可以靜態(tài)地修飾網(wǎng)頁，還可以配合各種腳本語言動(dòng)態(tài)地對(duì)網(wǎng)頁各元素進(jìn)行格式化。

上述內(nèi)容就是怎么在CSS中定義字體、顏色、背景等屬性，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。