1、outline 方案
如需要两层边框,可以先设置一层常规边框,再加上outline(描边)属性来产生外层的边框。
1 .test { 2 background: yellowgreen; 3 border:10px solid #655; 4 outline: 5px solid deeppink; 5 6 }
描边的另一个好处在于,可以通过outline-offset属性来控制它跟元素边缘之间的间距,这个属性可以接受负值。这对于某些效果来说非常重要。下例子中,实现了简单地缝边效果。
1 .test { 2 width: 300px; 3 height: 200px; 4 background: yellowgreen; 5 outline: 2px dashed deeppink; 6 outline-offset: -10px; 7 8 }
如图所示: