サイトに背景色と枠をつけてみた

本ブログ・サイトに背景色と枠を付けてみました。
備忘録として残しておきます。

背景指定方法

背景画像を自分の公開しているサイトのフォルダへ格納します。
※背景画像は、以下のサイトから無料でダウンロードできましたので利用させて頂きました。
ホームページ背景画像

background-imageプロパティを使って以下のように指定します。
urlは、画像を保存したurlを指定します。

枠の指定方法

記事の内容や記事一覧に外枠を付けます。
枠を付けたい要素に”contens_border”というクラス名を付け、CSSでレイアウトを設定します。
以下のように、borderでsolid(一本線）を指定し、線の太さと色を指定します。

※線の種類は、solid(一本線）以外にも以下のような種類を指定できます。
double・・・2本線
groove・・・立体的に窪んだ線
ridge・・・立体的に隆起した線
inset・・・上と左が暗く、下と右が明るく表示
outset・・・上と左が明るく、下と右が暗く表示
dashed・・・破線
dotted・・・点線

最後に

以上、背景色の設定と枠の設定方法でした。
背景色と枠を付けただけですが、
見やすさが少し改善されたのではないかと思います。

少しでも参考になれば幸いです。

スポンサーリンク