想到多重邊框，我們可能會通過多個元素來模擬實現，但是如何在乙個元素上實現多重邊框呢？如下圖：
我們可以通過box-shadow來實現。
box-shadow： h-shadow v-shadow blur spread color inset | outset；
分別是：水平陰影位置 垂直陰影位置 模糊距離 擴張半徑 顏色 內部陰影或者外部陰影
實現多重邊框我們可以通過擴張半徑來實現，box-shadow可以通過逗號分隔設定多個值。
注意：
.test-list
box-shadow只能實現實線邊框，對於虛線的邊框我們應該怎麼辦呢？
注：可以通過outline-offset屬性來控制他和元素邊框之間的間距，這個屬性值設定可以接收負值。
但是使用的時候以下的地方需要注意：
- outline不支援逗號分隔的多個屬性，因此，這種只適用於雙層邊框；
- outline不會貼合border-radius產生圓角的效果，只適用於方形
.test-list
效果如下：
css多重邊框
一 使用box shadow實現多重邊框 html div class multiple div css multiple效果圖 值得說明的是，box shadow是層層疊加的，第一層投影位於最頂層，依次類推。因此你需要按照此規律擴張半徑。比如上面的 如果我們想在外層在加乙個5px的外框，那麼久需要...
CSS揭秘 2 多重邊框
outline 方案 背景知識 box shadow的基本用法，outline基本用法 x偏移量 y偏移量 陰影模糊半徑 陰影擴散半徑 陰影顏色 box shadow 2px 2px 2px 1px rgba 0,0,0,0.2 以上是box shadow的基本引數。box shadow是為元素新增...
CSS揭秘 背景與邊框（2） 多重邊框
有些情況下，為了滿足一些要求，普通的邊框有點達不到我們的需求，這時我們可以使用多重邊框。box shadow屬性可以設定乙個或多個下拉陰影的框。語法 box shadow h shadow v shadow blur spread color inset 值 說明h shadow 必需的。水平陰影的...