css+div建站是現在最為常見的一種建站方式,也是搜尋引擎認可的原始碼站模式。而為了打造不同的頁面效果,在進行css建站時候還有另一屬性,這就是筆者小丹今天為大家分享的主題——css box-shadow屬性。
css box-shadow屬性可以用來給塊元素乙個陰影或內陰影,使用 border-image-* 屬性來構造漂亮的可伸縮按鈕哦!下面就讓我們仔細看看這個css屬性。
一般的語法 box-shadow屬性如下:
box-shadow: [inset] [horizontal offset] [vertical offset] [blur radius] [spread distance] [color];
即:css:(插圖) (橫向偏移量) (垂直偏移量) (模糊半徑) (傳播距離)(顏色);
css box-shadow房地產有六個可能的屬性值:
1、插圖
2、橫向偏移量
3、垂直偏移量
4、模糊半徑
5、傳播距離
6、顏色
只有兩個屬性值是必需的:水平偏移量和垂直偏移量。
四個屬性值,橫向偏移,垂直偏移,模糊半徑和傳播距離,必須使用css長度單位(例如px、em)。
顏色值必須是乙個css顏色單位如十六進製制值(例如# 000000)。
屬性值的總結
屬性值需要嗎?
單位如果沒有指定預設值
插圖沒有
關鍵字如果沒有指定插圖,盒子外的陰影將html元素。
橫向偏移量
是的長度
沒有預設值。它必須被指定。
垂直偏移量
是的長度
沒有預設值。它必須被指定。
模糊半徑
沒有長度
0傳播距離
沒有長度0顏色
沒有顏色
等於顏色屬性的html元素/ s盒陰影被應用到。 插圖
如果 inset關鍵字屬性值存在,內盒陰影將放置html元素。
橫向偏移量
水平偏移值控制x軸位置的影子,積極的價值將盒陰影,而消極的價值將它轉移到左邊。
在接下來的例子中,水平偏移量設定為20 px,或雙垂直偏移量的值(設定為10 px),所以影子是兩次廣泛的水平。
垂直偏移量
垂直偏移量控制盒陰影在y軸上的立場。積極的價值會向下移動,而負面價值將起來。
在接下來的例子中-20 px的垂直偏移量有乙個長度或雙水平偏移量(10 px)的長度,所以影子的大小是垂直軸上的兩倍。也因為該值為負,陰影的位置抵消對盒子的頂部。
模糊半徑
模糊半徑屬性值影響模糊強度/盒陰影的清晰度。
模糊半徑是可選的,如果你不指定它,它將預設為0。此外,它不能有負面價值,與水平偏移量和垂直偏移量。
如果模糊半徑為0,盒陰影將鋒利,它的顏色將固體。當你增加價值,它將變得越加模糊,更加不透明。
在下面的示例中模糊半徑值設定為20 px,因此模糊強度相當明顯。
傳播距離
傳播距離使兩盒陰影更大或更小,如果它有乙個積極的價值,盒陰影將變大。如果它有乙個負面價值,將合同各方盒陰影。
注意:因為積極的傳播距離(10 px),有乙個10 px陰影各方的盒子因為沒有水平偏移量和垂直偏移量:
當傳播距離為負時影子收縮。在接下來的例子中,影子小於框的寬度,因為其負面傳播距離和缺乏橫向偏移量:
顏色你可以通過它的名字,已經告訴顏色值集盒陰影的顏色。它可以使用任何css指定顏色,指定乙個顏色值是可選的。
如果你想要乙個不同的陰影顏色,那麼你需要指定的 box-shadow屬性值宣告。下面你可以看到,即使的前景顏色 div仍然是 red盒陰影顏色 blue。
多個框陰影
在這裡你可以得到真正有創造性地使用這個css屬性:您可以應用乙個以上的盒陰影元素。
語法如下:
box-shadow: [box shadow properties 1], [box shadow properties 2], [box shadow properties n];
即:css:[盒陰影屬性1],[2]盒陰影屬性,[n]盒陰影屬性;
換句話說,你可以有多個框陰影在每個屬性值組之間用逗號(,)。
在接下來的例子中有兩個框陰影:左上角乙個紅色的盒子和乙個藍色的右下方。
使用CL編譯器選項檢視C 類記憶體布局 轉
今天查資料的時候發現 vs 編譯器 cl 的乙個編譯選項可以檢視 c 類的記憶體布局,非常有用。使用如下,從開始程式選單找到 visual stdio 2008 2005 command prompt,選擇 vs 的命令列工具,按如下格式使用 cl d1reportsingleclasslayout...