如何在CSS中創建三重div邊框

Question

我想要創建以下div邊框： 我對綠色邊框部分進行了排序，但不是沿着頂部的紅色線條。有任何想法嗎？

到目前爲止的代碼：

#myborder { 
border: 4px solid green; 
} 

Answer 1

使用這個CSS http://jsfiddle.net/PESHk/3

#myborder { 
    box-shadow: 0 0 0 4px green, 0 0 0 4px green inset; 
    border-top:2px solid red; 
    padding:8px; 
} 

Answer 2

上Hushme的回答工作：通過使用::beforehttp://jsfiddle.net/PESHk/2/

#myborder { 
    box-shadow: 0 0 0 4px green, 0 0 0 4px green inset; 
    border-top: 2px solid red; 
    padding: 8px; 
} 

而且here：

#myborder { 
    box-shadow: 0px 4px 15px rgba(0,0,0,0.15); 
    border: 8px solid green; 
    border-top: 0; 
    padding: 16px 8px 8px 8px; 
    position: relative; 
} 

#myborder::before { 
    width: 100%; 
    background: red; 
    height: 2px; 
    border: 4px solid green; 
    content: ""; 
    display: block; 
    position: absolute; 
    left: 0; 
    top: 0; 
}