關于css3彩色的邊框陰影事例分享

頁面元素的邊框是我們常見的屬性，無非就是一些線條的節制用來區分區域，可是跟著慢慢的進修，小編發現本身仍是太年青了...，一個簡單可是燦艷區域朋分就是可以經由過程邊框暗影結果來實現的；

東西/原料

1
起首我們先寫一個簡單的靜態頁面，里面就放置一個 div ，之后用來演示，若何節制 div 的邊框暗影，達到燦艷的結果；
2
起首，我們先把 div 的樣式節制一下；
width ，height 節制寬和高；
margin 節制外邊距，趁便將 div 放置到頁面中心；
border，讓沒有內容的 div 閃現；
3
如圖一，我們可以看到邊框的邊角是圓弧的，這里的樣式也是由別的的屬性節制的；
border——radius：；
4
然后我們先簡單的節制一邊的暗影結果，暗影顏色設為黃色；
box-shadow：；
這個屬性就是節制暗影的，它的值有良多，我就不復述了，有樂趣的可以去查閱資料；
5
然后我們節制四邊的暗影，達到最終的結果；
代碼如圖，
從上到下，別離節制邊框的 ‘ 上右下左‘，每一邊設置完后我們要用逗號離隔，最后再用分號結從頭至尾；
（其實暗影節制可以達到很是厲害的結果，具體的常識點大師可以查查資料；這個屬性的常識點真的是太多了......）