上一次我們討論了box-shadow是給對象實現div容器的陰影效果，以及它的css樣式，今天我們討論一下box-shadow中的css樣式個代表什么意思。
例如：
demo{box-shadow: inset x-offset y-offset blur-radius spread-radius color}
box-shadow屬性至多有6個取值設置，他們分別代表：
Inset代表陰影類型，此取值是一個可選值，如果不設值，其默認的投影方式是外陰影；如果取其唯一值“inset”,就是將外陰影變成內陰影，也就是說設置陰影類型為“inset”時，其投影就是內陰影；
X-offset:是指陰影水平偏移量其值可以是正負值可以取正負值，如果值為正值，則陰影在對象的右邊，反之其值為負值時，陰影在對象的左邊；
Y-offset:是指陰影的垂直偏移量，其值也可以是正負值，如果為正值，陰影在對象的底部，反之其值為負值時，陰影在對象的頂部；
blur-radius： 含義是陰影模糊半徑，此取值是可選，，但其值只能是為正值，如果其值為0時，表示陰影不具有模糊效果，其值越大陰影的邊緣就越模糊；
spread-radius，含義是陰影擴展半徑，此取值可選，其值可以是正負值，如果值為正，則整個陰影都延展擴大，反之值為負值是，則縮小；
Color含義是陰影顏色，此取值可選，如果不設定任何顏色時，瀏覽器會取默認色，但各瀏覽器默認色不一樣，特別是在webkit內核下的safari和chrome瀏覽器將無色，也就是透明，建議不要省略此取值。
掃一掃 加微信咨詢
