-
奇偶是相對與同類型的標(biāo)簽而言
查看全部 -
/*任務(wù)部分*/? ?
div.semi-circle{?
? ? height:100px;
? ? width:50px;
? ? background:#9da;
? ? border-radius:50px 0 0 50px;
? ? }
查看全部 -
注意:
用逗號隔開每組 background 的縮寫值;
如果有 size 值,需要緊跟 position 并且用 "/" 隔開;
如果有多個背景圖片,而其他屬性只有一個(例如 background-repeat 只有一個),表明所有背景圖片應(yīng)用該屬性值。
background-color?只能設(shè)置一個。
查看全部 -
設(shè)置背景圖片的大小,以長度值或百分比顯示,還可以通過cover和contain來對圖片進行伸縮。
語法:
background-size:?auto?|?<長度值>?|?<百分比>?|?cover?|?contain
取值說明:
1、auto:默認值,不改變背景圖片的原始高度和寬度;
2、<長度值>:成對出現(xiàn)如200px 50px,將背景圖片寬高依次設(shè)置為前面兩個值,當(dāng)設(shè)置一個值時,將其作為圖片寬度值來等比縮放;
3、<百分比>:0%~100%之間的任何值,將背景圖片寬高依次設(shè)置為所在元素寬高乘以前面百分比得出的數(shù)值,當(dāng)設(shè)置一個值時同上;
4、cover:顧名思義為覆蓋,即將背景圖片等比縮放以填滿整個容器;
5、contain:容納,即將背景圖片等比縮放至某一邊緊貼容器邊緣為止。
查看全部 -
用來將背景圖片做適當(dāng)?shù)牟眉粢赃m應(yīng)實際需要。(位置固定不變,剪裁部分變化)
語法:
background-clip?:?border-box?|?padding-box?|?content-box?|?no-clip
參數(shù)分別表示從邊框、或內(nèi)填充,或者內(nèi)容區(qū)域向外裁剪背景。no-clip表示不裁切,和參數(shù)border-box顯示同樣的效果。
backgroud-clip
默認值為border-box。查看全部 -
語法:
background-origin?:?border-box?|?padding-box?|?content-box;
參數(shù)分別表示背景圖片是從邊框,還是內(nèi)邊距(默認值),或者是內(nèi)容區(qū)域開始顯示。
需要注意的是,如果背景不是no-repeat,這個屬性無效,它會從邊框開始顯示。
查看全部 -
text-shadow可以用來設(shè)置文本的陰影效果。
語法:
text-shadow:?X-Offset?Y-Offset?blur?color;
X-Offset:表示陰影的水平偏移距離,其值為正值時陰影向右偏移,反之向左偏移;??????
Y-Offset:是指陰影的垂直偏移距離,如果其值是正值時,陰影向下偏移,反之向上偏移;
Blur:是指陰影的模糊程度,其值不能是負值,如果值越大,陰影越模糊,反之陰影越清晰,如果不需要陰影模糊可以將Blur值設(shè)置為0;
Color:是指陰影的顏色,其可以使用rgba色。
查看全部 -
@font-face{??? 與括號間無空格!
查看全部 -
@font-face能夠加載服務(wù)器端的字體文件,讓瀏覽器端可以顯示用戶電腦里沒有安裝的字體。
語法:
@font-face?{ ????font-family?:?字體名稱; ????src?:?字體文件在服務(wù)器上的相對或絕對路徑; }
這樣設(shè)置之后,就可以像使用普通字體一樣在(font-*)中設(shè)置字體樣式。
比如:
p?{ ????font-size?:12px; ????font-family?:?"My?Font"; ????/*必須項,設(shè)置@font-face中font-family同樣的值*/ }
查看全部 -
用來設(shè)置是否使用一個省略標(biāo)記(...)標(biāo)示對象內(nèi)文本的溢出。
但是text-overflow只是用來說明文字溢出時用什么方式顯示,要實現(xiàn)溢出時產(chǎn)生省略號的效果,還須定義強制文本在一行內(nèi)顯示(white-space:nowrap)及溢出內(nèi)容為隱藏(overflow:hidden),只有這樣才能實現(xiàn)溢出文本顯示省略號的效果,代碼如下:
text-overflow:ellipsis;? overflow:hidden;? white-space:nowrap;
同時,word-wrap也可以用來設(shè)置文本行為,當(dāng)前行超過指定容器的邊界時是否斷開轉(zhuǎn)行。
normal為瀏覽器默認值,break-word設(shè)置在長單詞或?URL地址內(nèi)部進行換行,此屬性不常用,用瀏覽器默認值即可。
查看全部 -
線性漸變
參數(shù):
第一個參數(shù):指定漸變方向,可以用“角度”的關(guān)鍵詞或“英文”來表示:
第一個參數(shù)省略時,默認為“180deg”,等同于“to?bottom”。
第二個和第三個參數(shù),表示顏色的起始點和結(jié)束點,可以有多個顏色值。
查看全部 -
box-shadow陰影
查看全部 -
白色的RGB值為(255,255,255)
查看全部 -
語法: color:rgba(R,G,B,A)
以上R、G、B三個參數(shù),正整數(shù)值的取值范圍為:0 - 255。百分數(shù)值的取值范圍為:0.0% - 100.0%。超出范圍的數(shù)值將被截至其最接近的取值極限。并非所有瀏覽器都支持使用百分數(shù)值。A為透明度參數(shù),取值在0~1之間,不可為負值。
查看全部 -
注意:Chrome下,中間部分也會被拉伸,webkit瀏覽器對于round屬性和repeat屬性似乎沒有區(qū)分,顯示效果是一樣的。
Firefox 26.0 下是可以準(zhǔn)確區(qū)分的。
查看全部
舉報