MakoLog

webサイトに関すること全般

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

背景の色を変えたり、背景の画像を変えたりする方法【L_ten】

※自分の自作テンプレート用のブログの記事をこちらに移しています※
testblog12141.png

色も画像も簡単に変えることが出来ます
テンプレートL_ten」を使って下さっている方に向けての記事になります
※「L_ten_blue」は背景変更に対応していません 編集は自己責任でお願いします
テンプレートの編集時は、必ずバックアップをとっておきましょう!

設定のテンプレートの設定に移動します

テンプレートL_ten」は初期設定で背景色が白(#ffffff)になっています
なので、色を変えるだけなら、この数値を変えるだけになります

テンプレートの設定の画面で「Ctrlキー」+「Fキー」を同時押しをして
#ffffff」と入力して、検索します

testblog - FC2 BLOG 管理ページ (1)

↑の画像のオレンジの所ですね
色の数値は「色 html」などと検索して探してきて下さい

一番上の画像では「#585858」の灰色に変更しています
真っ赤だと「#FF0000」、真っ青だと「#0000FF」などといっぱいあります
自分好みの色、まぁ見やすい色に変えるのが良いとは思います

基本的にこの「L_ten」は画像を使わずに作っているので
今回は背景に関してだけですが、色はどれも自分で変更出来ます 




ここからは背景を画像に変更したい方へ向けてです

まぁ先ほどと見る所は変わりません
↓の灰色になっている文
background-image:url("画像のURL");」を追加しただけです

testblog - FC2 BLOG 管理ページ (2)

これは画像を見てしっかり「body」に挿入して下さい
{}の外だったり、別の{}の中だとおかしくなりますので注意

では例えば、この画像のURLを「画像のURL」のところに挿入してみます

エルディ150

↓の画像のようになります
デフォルトの設定で、これは左から順に無限に貼り付けるようになっています
大きな画像を貼り付けても同様です

testblog_20140208220544382.png

背景画像は色々と並べる方法に種類があります
「横1列」に画像を並べるなら、「background-repeat: repeat-x;」
「縦1列」に画像を並べるなら、「background-repeat: repeat-y;」
画像を「1枚だけ」表示するなら、「background-repeat: no-repeat;」
画像を「中央」に表示するなら、「background-position: center center;」
画像を「左上」に表示するなら、「background-position: left top;」
などを「body」に挿入することで変更出来ます

そしてもう一つ、背景画像のスクロールした時の動作
スクロールをさせる場合は、「background-attachment: scroll;」
スクロールをさせない場合は、「background-attachment: fixed;」
とまた「body」に挿入することで変更出来ます

設定はこれ以外にもありますので、自分好みのカスタマイズをしてみて下さい

何か困ったこととかあればコメントください
すみません、質問いいでしょうか?

コメント欄なのですが、いただいたコメントの背景を白く見やすく表示させたいのです。

私からの返信の部分だけ、水色にできたのですが、
他の方からのコメントには背景をつけることができなくて・・・

すみませんが、教えていただけるとありがたいです。


ちなみにこのページ、
コメント欄が、こんな感じで表示されています。
http://gunapi.blog.fc2.com/blog-entry-24.html
2014/11/15(土) 17:20:33 | URL | ぐな  [編集]
一部のテンプレートには背景が設定されていないことがありまして、
ご迷惑をお掛けしました。

スタイルシートの「.content」に「background:#fff;」を追加すれば、
背景は白色になると思います。
他の部分まで背景が白色になりますが、それが正常です。

コメントする人によって背景を変えている場合、上記の記述だと背景は全て白色になります。
2014/11/15(土) 19:18:37 | URL | makoto  [編集]

コメントの投稿

  • URL
  • コメント(必須)
  • パスワード
  • 秘密
  • 管理者にだけ表示を許可する

プロフィール

makoto

Author:makoto
個人でWebサイトを作っている人です

共有テンプレート公開中
テンプレートの名前を「L_ten」で検索

Twitter

検索フォーム

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。