CSS3 box-shadow(陰影使用)

css3 box-shadow 內陰影與外陰影

1-

box-shadow具體使用方法,語法:

E {box-shadow:inset x-offset y-offset blur-radius spread-radius color}
換句說:
對象選擇器 {text-shadow:投影方式 X軸偏移量 Y軸偏移量 陰影模糊半徑 陰影擴展半徑 陰影顏色}

取值:投放方式:默認是外陰影 ,

box-shadow屬性至多有6個參數設置,他們分別取值:

陰影類型:此參數是一個可選值,如果不設值,其默認的投影方式是外陰影;如果取其唯一值“inset”,就是將外陰影變成內陰影,也就是說設置陰影類型爲“inset”時,其投影就是內陰影;

X-offset:是指陰影水平偏移量其值可以是正負值可以取正負值,如果值爲正值,則陰影在對象的右邊,反之其值爲負值時,陰影在對象的左邊;

Y-offset:是指陰影的垂直偏移量,其值也可以是正負值,如果爲正值,陰影在對象的底部,反之其值爲負值時,陰影在對象的頂部;

陰影模糊半徑:此參數是可選,,但其值只能是爲正值,如果其值爲0時,表示陰影不具有模糊效果,其值越大陰影的邊緣就越模糊;

陰影擴展半徑:此參數可選,其值可以是正負值,如果值爲正,則整個陰影都延展擴大,反之值爲負值是,則縮小

-moz-box-shadow:5px 5px 5px #999 inset;
-webkit-box-shadow:5px 5px 5px #999 inset;
box-shadow:5px 5px 5px #999 inset;






CSS3 <wbr>box-shadow(陰影使用)

-moz-box-shadow:-5px -5px 5px #999 inset;
-webkit-box-shadow:-5px -5px 5px #999 inset;
box-shadow:-5px -5px 5px #999 inset;
CSS3 <wbr>box-shadow(陰影使用)

inset 使用。

更多請訪問....

轉載:http://www.w3cplus.com


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章