這篇文章主要介紹了CSS層疊樣式表常見(jiàn)屬性有哪些,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
創(chuàng)新互聯(lián)建站是一家專注于成都網(wǎng)站建設(shè)、網(wǎng)站制作與策劃設(shè)計(jì),惠濟(jì)網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)建站做網(wǎng)站,專注于網(wǎng)站建設(shè)10余年,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:惠濟(jì)等地區(qū)?;轁?jì)做網(wǎng)站價(jià)格咨詢:18982081108常見(jiàn)屬性
1 顏色屬性
color屬性定義文本的顏色
color:green
color:#ff6600
color:#f60(簡(jiǎn)寫(xiě)式)
color:rgb(255,255,255) 紅(R).綠(G).藍(lán)(B)每個(gè)的取值范圍0-255
color:rgba(255,255,255,1) RGBA是代表Red(紅色).Green(綠色).Blue(藍(lán)色)和Alpha的(色彩空間)透明度
2 字體屬性
2.1 font-size 字體大小
font-size:14px
2.2 font-family 定義字體
font-family:微軟雅黑,serif;
可以使用","隔開(kāi),以確保當(dāng)字體不存在的時(shí)候直接使用下一個(gè)
2.3 font-weight 字體加粗
normal(默認(rèn)值).bold(粗).bolder(更粗).lighter(更細(xì))
100.200.300-900 400=normal,而700=bold
3 背景屬性
3.1 背景顏色 background-color
3.2 背景圖片 background-p_w_picpath
background-p_w_picpath:url(圖片路徑)
background-p_w_picpath:none
3.3 背景重復(fù) background-repeat
repeat 重復(fù)平鋪滿
repeat-x 向X軸重復(fù)
repeat-y 向Y軸重復(fù)
no-repeat 不重復(fù)
3.4 背景位置 background-position
橫向(left,center,right)
縱向(top,center,bottom)
3.5 簡(jiǎn)寫(xiě)方式
background:背景顏色 url(圖像)重復(fù) 位置
background:#f60 url(p_w_picpaths/bg.jpg)no-repeat top center
4 文本屬性
4.1 text-align 橫向排列 left,center,right
4.2 line-height 文本行高
%基于字體大小的百分比行高
數(shù)值來(lái)設(shè)置固定值
4.3 text-indent 首行縮進(jìn)
4.4 letter-spacing 字符間距
normal 默認(rèn)
length 設(shè)置具體的數(shù)值(可以設(shè)置負(fù)值)
inherit 繼承
5 邊框?qū)傩?/p>
5.1 邊框風(fēng)格 border-style
5.1.1 統(tǒng)一風(fēng)格(簡(jiǎn)寫(xiě)風(fēng)格) border-style
5.1.2 單獨(dú)定義某一方向的邊框樣式
border-bottom-style 下邊邊框樣式
border-top-style 上邊邊框樣式
border-left-style 左邊邊框樣式
border-right-style 右邊邊框樣式
5.1.3 邊框風(fēng)格樣式的屬性值
none 無(wú)邊框
solid 直線邊框
dashed 虛線邊框
dotted 點(diǎn)線邊框
double 雙線邊框
groove 凸槽邊框
ridge 壟狀邊框 依托border-color的屬性值
inset inset邊框
outset outset邊框
inherit 繼承
5.2 邊框?qū)挾? border-width
5.2.1 統(tǒng)一風(fēng)格 border-width
5.2.2 單獨(dú)風(fēng)格
border-top-width 上邊邊框?qū)挾?/p>
border-bottom-width 下邊邊框?qū)挾?/p>
border-left-width 左邊邊框?qū)挾?/p>
border-right-width 右邊邊框?qū)挾?/p>
5.2.3 邊框?qū)挾鹊膶傩灾?/p>
thin 細(xì)邊框
medium 中等邊框
thick 粗邊框
px 固定值的邊框
inherit 繼承
5.3邊框顏色 border-color
5.3.1 統(tǒng)一風(fēng)格 border-color
5.3.2 單獨(dú)風(fēng)格
border-top-color 上邊邊框顏色
border-bottom-color 下邊邊框顏色
border-left-color 左邊邊框顏色
border-right-color 右邊邊框顏色
5.3.3 屬性值
顏色值的名稱 red.green
RGB rgb(255.255.0)
RGBA rgba(255.255.0.0.1)
十六位進(jìn)制 #ff0.#ff0000
繼承 inherit
5.3.4 屬性值的四種情況
一個(gè)值:border-color:(上.下.左.右)
兩個(gè)值:border-color:(上下)(左右)
三個(gè)值:border-color:(上)(左右)(下)
四個(gè)值:border-color:(上)(右)(下)(左)
5.3.5 簡(jiǎn)寫(xiě)方式 border:solid 2px #f60
6 列表屬性
6.1 標(biāo)記的類型 list-style-tyle
none 無(wú)標(biāo)記
disc 默認(rèn),標(biāo)記是實(shí)心圓
circle 標(biāo)記是空心圓
square 標(biāo)記是實(shí)心方塊
decimal 標(biāo)記是數(shù)字
decimal-leading-zero 0開(kāi)頭的數(shù)字標(biāo)記(01,02,03,等)
lower-roman 小寫(xiě)羅馬數(shù)字(i,ii,iii,iv,v等)
upper-roman 大寫(xiě)羅馬數(shù)字(I,II,III,IV,V等)
lower-alpha 小寫(xiě)英文字母The marker is lower-alpha(a,b,c,d,e,等)
upper-alpha 大寫(xiě)英文字母The marker is upper-alpha(A,B,C,D,E,等)
lower-greek 小寫(xiě)希臘字母(alpha,beta,gamma,等)
lower-latin 小寫(xiě)拉丁字母(a,b,c,d,e,等)
upper-latin 大寫(xiě)拉丁字母(A,B,C,D,E,等)
hebrew 傳統(tǒng)的希伯來(lái)編號(hào)方式
armenian 傳統(tǒng)的亞美尼亞編號(hào)方式
georgian 傳統(tǒng)的喬治亞編號(hào)方式(an,ban,gan,等)
cik-ideographic 簡(jiǎn)單的表意數(shù)字
hiragana 標(biāo)記是:a,i,u,e,o,ka,ki,等。(日文片假名)
katakana 標(biāo)記是:A,I,U,E,O,KA,KI,等。(日文片假名)
hiragana-iroha 標(biāo)記是:i,ro,ha,ni,ho,he,to,等。(日文片假名)
katakana-iroha 標(biāo)記是:I,RO,HA,NI,HO,HE,TO,等。(日文片假名)
6.2 標(biāo)記的位置 list-style-position
inside 列表項(xiàng)目標(biāo)記放置在文本以內(nèi),且環(huán)繞文本根據(jù)標(biāo)記對(duì)齊
outside 默認(rèn)值,保持標(biāo)記位于文本的左側(cè),列表項(xiàng)目放置在文本以外,且環(huán)繞文本不根據(jù)標(biāo)記對(duì)齊
inherit 規(guī)定應(yīng)該從父元素繼承l(wèi)ist-style-position屬性的值
6.3 設(shè)置圖像列表標(biāo)記 list-style-p_w_picpath
URL 圖像的路徑
none 默認(rèn),無(wú)圖形被顯示
inherit 規(guī)定應(yīng)該從父元素繼承l(wèi)ist-style-p_w_picpath屬性的值
6.4 簡(jiǎn)寫(xiě)方式 list-style
list-style:square inside url('/i/arrow.jpg')
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“CSS層疊樣式表常見(jiàn)屬性有哪些”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián),關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。