ホームページ素材の境界にはborderを

グラデーションなホームページ素材を作成したら、ホームページの背景画像へと組み込むことになるかと思いますが、その際、境界にはborderを設定しておくといいかと思います。

スタイルシートで設定していくわけですが、たいていは左側と右側に境界線を作成することになるかと思います。当ブログの場合はこのような感じでボーダー線を引いています。

スタイルシートへの設定方法ですが、境界を上、下、左、右のどれに設定するかと境界線のタイプ、幅、色彩をせっていします。グラデーション素材を背景画像に設定している箇所のひとつ内側の要素がいいかと思います。

通常、borderをスタイルシートに設定する際はこのような感じになります。

border-width: 1px; (線幅の値)
border-style: solid; (線の種類:実線、点線など。)
border-color: #000000; (線の色彩)

この場合だと、上下左右に境界線が1pxの幅で、黒い実線でひかれることになります。

左右だけに境界線を設定したいばあいはこのようになります。

border-right-width: 1px;
border-left-width: 1px;
border--rightstyle: solid;
border-left-style: solid;
border-right-color: #000000;
border-left-color: #000000;

これをまとめて書くこともできるので、最終的にはこんな感じするといいかと思います。

border-right: 1px solid #000000;
border-left: 1px solid #000000;