Q:ウェブリブログの背景に色や画像を設定したいのですが(CSS編集)

A:
ウェブリブログの背景に色や画像を設定する場合は、CSS編集機能(上級者向け)をご利用ください。

CSS編集時の注意事項
  • CSSは個人トップページ、月別ページ、テーマ別ページ、記事ページの全てに適用されます。

  • CSSの編集内容によってはレイアウトが崩れる可能性があります。

  • 大幅に変更する場合は、変更前のCSSをメモ帳などに保存することをお勧めいたします。

  • 元に戻したい場合は [初期値をフォームに入力] を選択した後に [ 設定 ] ボタンを押してください。

  • デザインを大幅に変更する場合はデザインテンプレートの設定を、デザインジャンル[CSS編集用]、デザイン名称[CSS編集用(デザインなし)]に変更してください。


CSS編集手順
  1. ウェブリブログトップページ」より管理画面へログインしてください。

  2. ブログ項目の[設定]をクリックしてください。


  3. [オプション]をクリックしてください。


  4. CSS編集(上級者向け)項目の[設定画面へ]ボタンをクリックしてください。


  5. CSSを編集してください。

  6. [設定]ボタンをクリックしてください。


CSSの編集例につきましては、「オリジナルデザインガイド」や「第103回(タイトル画像を変更してみよう!~上級編~)」をご覧ください。

また、以下に一例をご案内いたします。

●背景色の設定例

CSS内の [共通スタイル(トップ、月別、テーマ別、記事ページ共通)]のbody部を以下のように編集してください。
body{
  background:******; /* 背景色をカラー名やRGB値で指定する */
}

※******部にはカラーコードやカラー名を入力してください。

[カラーコード例]
#FFFFFF
#FFFFCC
#FFCCCC
#CCFFFF
#CC99FF
#00FFCC



●背景画像の設定例

CSS内 の[共通スタイル(トップ、月別、テーマ別、記事ページ共通)]のbody部を以下のように編集してください。
background:url("背景画像のURL"); /* 背景に画像を敷きつめる */
}

backgroundは背景に関する以下のスタイルを一度に定義することができます。


 background-color :背景色
 background-image :背景画像
 background-repeat :背景画像の繰り返し方法
 background-attachment :スクロール時の背景画像の振る舞い
 background-position :背景画像の位置

選択中のデザインテンプレートの背景画像を消す場合は以下のように編集してください。
body{
  background-image:none; /* 背景画像を消す */
}


※個々のCSS編集方法に関しましてはサポート対象外となっております。市販の解説書をご参照いただくなど、お客様ご自身の責任においてご利用いただくか、ユーザ同士の助け合いの場「ウェブリ広場」をご活用ください。

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 18

なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス ナイス
ガッツ(がんばれ!)
かわいい

この記事へのコメント

  • **雪菜**

    スクロールバーの色は変更出来ないのでしょうか?
    タグを入れてみましたが 変わりませんでした
    2006年09月08日 12:07
  • agouti

    CSS設定の項目が表示されないので、この記事を読んでも意味がありませんでした。
    2014年04月29日 09:59

この記事へのトラックバック