CSSを使用して2つのボーダーカラーを使用する方法

Question

まず、私は英語が良くありません。申し訳ありませんT.T ;;

2色の境界線を持つlike thisというボックスを作りたいと思います。私はCSSを使用してそれをしようとしてきたborder-colorが、私はそれを実装することはできません。私はこれについて何か考えを知りたい。

私は重複したくないですdiv。私はCSSだけを使いたい。

CSSを使用してこれをどのように設計できますか？ pls T.T ;;

これは私がこれまで持っているものです：あなたが探しているものを

#box{ 
 
\t margin-top:10px; 
 
\t width: 950px; 
 
\t height:100px; 
 
\t border:5px solid #f3f3f3; 
 
\t padding: 5px; 
 
}

<div id="box"> 
 

 
</div>

Regards,

Answer 1

はCSS3 box-shadowです。

あなたがのために0px値でbox-shadowを適用

#box{ 
 
margin-top:10px; 
 
width: 950px; 
 
height:100px; 
 
border:5px solid #f3f3f3; 
 
padding: 5px; 
 
box-shadow: 0px 0px 0px 2px #ddd; 
 
}

<div id="box"> 
 
</div>

のxオフセットとyオフセット、あなたはすべての4つの側面に影を取得します。さらに、ぼかしの値が 0pxの場合、最終的には2色の境界線のように見えます。