ＣＳＳテンプレートについて教えてください。

ＣＳＳテンプレートについて教えてください。

ＨＰ作成初心者です。



現在、無料のＣＳＳテンプレートにて、ＨＰを作成しているのですが、どうしてもヘッダーのデザインを変更したくて悩んでおります。



メモ帳（テンプレートデザインを指定しているらしいもの）には



/**レイアウト**/

#head{

height:300px;

border:solid;

border-color:#FF3399; /*ヘッダーの上部ライン*/

border-width:15px 0 0 0;

background-color:#333333;/*ヘッダーの背景色*/

height:300px;

border:solid;

border-color:#FF3399; /*ヘッダーの上部ライン*/

border-width:15px 0 0 0;

background-color:#333333;/*ヘッダーの背景色*/

margin:0 0 30px 0;

}



と、書いてあり、ピンクの細い線と、黒い太線の２ラインで構成されています。



コレを、ピンクの細い線、黒の太線、ピンクの細い線（最初の線と同じ色と太さ）…という３ラインで構成したいのですが、どうしても上手くできません。



追加するべき言葉が何なのか、どなたか詳しく教えていただけませんか。

同じ指令を重複してあっても意味がないので省きました。

下記でいけると思います。



/**レイアウト**/

#head{

background-color:#333333; /*背景色:#333333(黒っぽい色)*/

height:300px; /*高さ：300px*/

border:solid; /*線の種類：１本線*/

border-color:#FF3399; /*線の色：#FF3399(ピンク色)*/

border-width:15px 0 15px 0; /*線の太さ：上15px 右0 下15px 左0*/

margin:0 0 30px 0; /*マージン幅：上0 右0 下30px 左0*/

}



変えてるのは↓ここだけです。

border-width:15px 0 0 0;

border-width:15px 0 15px 0;

４つの数字は、上右下左の数値を表しており、下の線の太さは左から３つ目の数字で調節します。

最初の状態では下の線幅は0pxと指定してあるので、ラインが見えることはありません。

左から３つ目を、上と同じ15pxと指定したことにより、上の線と同じ幅の線が下に引かれます。



※なお、重複している内容は、後から書いた記述が適用されます。

せっかくborder-width:15px 0 15px 0;に変更しても、下の行にborder-width:15px 0 0 0;と書かれてあればそちらが優先となり、それより上の行に書いてある指令は無効になります。ご注意下さい。