横浜べいすた。
最近ブログを始めた。
オリジナリティあふれるブログに憧れる。
空条Q太郎。
スタンド使い?
星つながりで、ベイスタの面倒をみる。
記事の背景に画像を入れてみよう [background基礎]
:「久しぶりだなベイスタ・・・」 :「Q太郎さん、どこへ行っていたんですか?」 :「ああ、ちょっとエジプトへ」 :「みてくださいレイアウト変わりましたよ。 .article-body{ line-height:1.6; margin:0 0 20px 0; font-size:10pt; font-weight:bold; color:midnightblue; } へへへ、文字の色も変えちゃった」 :「成長したな、康一君」 :「えーっ、康一君て誰ですか!! 僕はベイスタですってば」 :「うっとおしいぞ、このアマ!!」 :「男だし・・・・ まぁそんなことはどうでもいいや。 Q太郎さんがいない間に季節も変わっちゃったよ。 そこで僕思ったんだ。 記事の背景部分を季節感のあるものにしたいんだ。 so-netのブログって記事部分が無地なの多いでしょ。 なんか、そういうとこカスタマイズできるかなって思っちゃった」 :「ふっ、お前がこうしたいって案をだすとはな。 やれやれだぜ。 よし、良いだろう教えてやる。 ここに1枚の画像がある。 この画像を使って説明しよう。 その前に、一つ確認だ。 ベイスタ、お前は背景をどうしたいんだ? ワンポイントで使うのか? それとも完全な記事の背景として使うのか? どちらだ」 :「ええーっ、ワンポイントで使うことなんても 出来るんですか~? 僕、完全に記事の背景でしか考えてませんでした・・・」 :「それでは実際の画面を見てみろ。 まず記事の背景として (ここでは画像を繰り返し使用しています。 繰り返しについては下部で触れております)そして時は動き出すそしてこっちがワンポイントそして時は動き出す:「一つ忠告しておく。 どちらに使うにしても画像の大きさと透明度には気をつけろ。 背景に使う画像があまりにも小さすぎるとみっともないし 文字と重なると文字が見にくくなる。 ここは.article{ }内のwidthの値に気を配るんだな。 ワンポイントにしても同じだ あまりにも大きいと邪魔だし 文字と重なると文字が見にくくなる」 :「CSSの記述はどうすればいいんですか?」 :「.article-body{ }内でアップロードしてある 背景画像に使いたいファイルを選べば完了だ」 :「ところでQ太郎さん、上の画像を見ると背景画像って 自分の好きな場所に置けるんですか?」 :「ああ、配置できるのは次の9か所。 それぞれブログの画面と同じ配置だ。
left top | center top | right top |
left center | center center | right center |
left bottom | center bottom | right bottom |