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

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

背景指定方法

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

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

枠の指定方法

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

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

最後に

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

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

スポンサーリンク

飲食店用WordPress無料テーマ
「InomaRestaurantBasic」

飲食店用の無料WordPressテーマを作成しました。
店のコンセプト、メニュー、アクセスなど
飲食店に必要な最低限の機能を搭載しました。
これから飲食店のホームページを開設したい方、
この無料テーマを是非活用してみてください。

詳しくはこちらへ

ブログ用WordPress無料テーマ
「chameleon(カメレオン)」

WordPressテーマ（chameleon）は、「WordPressで手軽・気軽にブログ始められる」をコンセプトに制作しました。
初めてWordPressでブログを始める方、是非シンプルなテーマchameleon「カメレオン」を使ってみてください！

詳しくはこちらへ

士業用WordPress無料テーマ
「InomaExpertBasic」

士業用の無料WordPressテーマを作成しました。
もちろん、一般的なビジネスサイトに活用できます。
自分でサイト更新したい方、
これからホームページを立ち上げようとする方、
自分でWordPressテーマを作ってみたい方、
この無料テーマを是非活用してみてください。

詳しくはこちらへ