-
box-shadow: 0, 0, 40px rgba(0, 0, 0, 0.1) inset;
0, 0 可實現四邊陰影
查看全部 -
boxx-shodow
查看全部 -
box-shadow: 添加一個或多個陰影
box-shadow:h-shadow v-shadow blur spread color inset
參數:
h-shadow（必需）：水平陰影的位置，允許負值，正值為向右；inset的話，正值為陰影在左
v-shadow（必需）：垂直陰影的位置，允許負值，正值為向下；inset的話，正值為陰影在上
blur（可選）：模糊程度
spread（可選）：陰影的尺寸/模糊距離
color（可選）：陰影的顏色，請參閱CSS顏色值
inset（可選）：將外部陰影（outset）改為內部陰影
瀏覽器兼容：IE9+、Firefox 4、Chrome、Opera以及Safari 5.1.1支持box-shadow屬性
查看全部 -
transform:rotate(-4deg)
對圖形進行旋轉
查看全部 -
transform: 向元素應用2D或3D轉換
transform:none|transform-functions
參數：
skew(x-angle,y-angle)定義沿著X和Y軸的2D傾斜轉換
skewX(angle)定義沿著X軸的2D傾斜轉換
skewY(angle)定義沿著Y軸的2D傾斜轉換
瀏覽器兼容：
Internet Explorer 9支持替代的-ms-transform屬性（僅適用于2D轉換）
Safari和Chrome支持替代的-webkit-transform屬性（3D和2D轉換）
Opera只支持2D轉換
查看全部 -
clear:both：元素被向下移動用于清除之前的左右浮動。
查看全部 -
.effect:after,.effect:before{}
同時在.effect的前面和后面插入一個同樣的盒子
查看全部 -
z-index:-1
新插入的content就會跑到下面
查看全部 -
border-radius:100px 10px
左上角和右下角100，左下角和右上角10
查看全部 -
border-radius:100px/10px
水平方向的彎曲半徑是100px，垂直方向是10px
查看全部 -
通過方向值top right bottom left來確定盒子的大小size
查看全部 -
<body> ??<div?class="wrap?effect"> ????<h1>Shadow?Effect</h1> ??</div> </body>
.effect:after{ ????content:'hello'; }因為h1的line-height設為了200px，而.wrap的height也是200px，所以hello跑到了盒子外面
查看全部 -
content內容除了可以是字符串外，也可以用attr來獲取標簽上的一些屬性，也可以用url來指定一張圖片、一個文件
查看全部 -
<body> ??<div?class="wrap?effect"> ????<h1>Shadow?Effect</h1> ??</div> </body>
.effect:before{ ????content:'hello'; }查看全部 -
:after與:before用法
:after選擇器：在被選元素的內容后面插入內容
:before選擇器：在被選元素的內容前面插入內容
說明：需使用content屬性來指定要插入的內容
瀏覽器兼容：IE、Firefox、Chrome、Safari、Opera
對于IE8及更早版本中的:after，必須聲明<!DOCTYPE>
查看全部 -
box-shadow:0 0 50px rgba(255,0,0,0.1) inset
前兩個數值設為0的話，內陰影會從四邊都出來
查看全部 -
瀏覽器兼容
查看全部 -
box-shadow: 添加一個或多個陰影
box-shadow:h-shadow v-shadow blur spread color inset
參數:
h-shadow（必需）：水平陰影的位置，允許負值，正值為向右；inset的話，正值為陰影在左
v-shadow（必需）：垂直陰影的位置，允許負值，正值為向下；inset的話，正值為陰影在上
blur（可選）：模糊程度
spread（可選）：陰影的尺寸/模糊距離
color（可選）：陰影的顏色，請參閱CSS顏色值
inset（可選）：將外部陰影（outset）改為內部陰影
瀏覽器兼容：IE9+、Firefox 4、Chrome、Opera以及Safari 5.1.1支持box-shadow屬性
查看全部 -
style.css
查看全部 -
index.html
查看全部 -
css3 box shadow 曲線陰影 翹邊陰影
查看全部
舉報