Template Bank[テンプレートバンク]
スタイルシートの作り方

ページの背景に画像を表示する方法

Category : スタイルシートの作り方

ページ全体の背景に画像を表示すると、かなりイメージが変わりますね。
サイトに訪れる人は、数秒であなたのサイトを評価して、次のアクションを起こします。
次のアクションが別のサイトに移動するというにならないためには、第一印象が大事です。

ページ全体の背景に画像を表示するには、bodyタグに、background-image属性を定義します。

■スタイルシートの記述方法

body { background-image: url(<$MTBlogURL$>bodyback.gif); }

url()で、画像ファイルを指定します。
<$MTBlogURL$>は、Movable Typeのインデックスページがおいてあるフォルダのパスを表します。

また、小さい画像を横または、縦方向だけに繰り返して表示するには、background-repeat属性を使います。

background-repeat:repeat-x;で、横方向への繰り返し
background-repeat:repeat-y;で、縦方向への繰り返し
background-repeat:no-repeat;は、繰り返さない
なにも指定しなければ、双方向に繰り返して表示されます。

関連記事
Category

Movable Typeとは、なぜMovable Typeを使うのか、Movable Typeのしくみ、テンプレートとは、プラグインとは、Movable Typeの基本を初心者にもわかりやすく解説します。

テンプレートの作り方、スタイルシートを使ったデザイン、プラグインの紹介と使い方、モジュール・テンプレートの使い方、1カラム型・2カラム型・3カラム型テンプレートの作り方などを初心者にもわかりやすく解説します。

1カラム型、2カラム型、3カラム型のテンプレートを作る方法

Movable Typeのスタイルシートを使って、オリジナルデザインにしよう

インストールのトラブル、記事(エントリー)投稿時のトラブル、サーバエラーやページが表示されないなどのMovable Typeに関する疑問・質問を解決します。

Movable Type3.2用のテンプレートを無料配布しています。 1カラム型、2カラム左サイドバー型、2カラム右サイトバー型、3カラム型、フリースタイルなど今後もどんどん追加する予定です。