? ? ? ?今天主要學(xué)習(xí)了盒子陰影-box shadow屬性迈勋。
代碼書寫1
代碼書寫2
? ? ? ? box-shadow:5px 5px rgba(0,0,0,.6);其中第一個5PX代表x軸向右的偏移量憾朴,第二個5px代表y軸向下的偏移量销凑,“rgba”使用紅焙贷、綠缩抡、藍(lán)三種顏色的疊加來表示顏色,a表示透明度哗讥,取值0-1之間迈窟,值越大陰影部分越清晰。
? ? ? ? box-shadow:5px 5px ?5px rgba(0,0,0,.6);第三個值表示陰影部分的模糊度忌栅,不能為負(fù)值,且值越大越模糊。
? ? ? ? box-shadow:5px 5px? 5px ?10px rgba(0,0,0,.6);第四個值表示設(shè)置陰影的外延值索绪,外延值可以為負(fù)值湖员,但負(fù)值的絕對值必須小于X軸或Y軸中最小的值。
? ? ? ? box-shadow:5px 5px? 5px? 1px rgba(0,0,0,.6) inset;指設(shè)置對象陰影為內(nèi)陰影瑞驱。
? ? ? ? box-shadow:0 0 5px 3px rgba(255,0,0,.6),表示紅黃綠三種顏色交互作用的顯示娘摔。
頁面展示
? ? ? ? ? 以上就是今天所學(xué)內(nèi)容。