背景 １

今回は背景について説明したいと思います。

背景の設定は2種類あります。
1つは色、もう１つは画像の設置です。
設定は下記のようになります。

＜色の設定の場合＞
＜span style="background-color:色の名前"＞時よ止まれ＜/span＞
例　時よ止まれ
＜span style="background-color:orange"＞時よ止まれ＜/span＞

<画像の設定の場合＞
＜span style="background-image:url(ファイルの名前);"＞時よ止まれ＜/span＞
例　時よ止まれ
＜span style="background-image:url(/_images/blog/_c4a/dio-the-world/stripe2.jpg)"＞

※ファイルの名前には、url(の次に記事作成の下のファイル一覧から背景にしたい画像を選択する。
＜a href="/_images/blog/_c4a/dio-the-world/stripe2.jpg" target="_blank"＞
＜img src="/_images/blog/_c4a/dio-the-world/m_stripe2.jpg" width="350" height="87"
 border="0" align="" alt="stripe.jpg" /＞＜/a＞と出るので
赤字の部分だけを残し、後は消去する。

※画像は必ず全て表示されるわけではありません。
背景画像の詳細設定は次回に説明します。

これは、この時よ止まれという部分に


上の画像を背景に用いました。

いままで区間にCSSを適用する際には
＜span＞~＜/span＞を使用してきましたが
次に＜div＞~＜div＞を紹介したいと思います。

＜span＞も＜div＞も区間を表すタグですが
＜DIV＞ と ＜SPAN＞ の違いは，
前後に改行を伴うか，伴わないかです。

この記事を見ていただければお分かりになると思いますが
前半部分はlightgreenにて
後半部分は/_images/blog/_c4a/dio-the-world/stripe2.jpgというファイルにて
背景を埋めております。

＜span＞タグが一部分なのに対し＜div＞タグは
枠全体に影響します。　
両方を組み合わせることによって、オリジナルの
ページの作成も可能です。

記事中のタグに関わる文字(<　>含むは全て半角です)
＜div＞タグを使うと自動改行にならないようなので＜pre＞タグが必要みたいです。
見づらい画像を使用してしまって申し訳ございません。

タグ：カスタマイズ ブログ 背景 CSS

コメント 4

おぉ～！！
ストライプも好きです～！！
by tamanossimo (2010-06-08 02:53) 

tamanossimoさん、こんばんは。

画像どうぞ使って下さい。
背景に画像を挿入すると
全く感じが変わりますからね。

画像の透明度を多くしないと
肝心の記事が読みづらくなるという
欠点はありますけど。

是非挑戦してみて下さいね。
by uryyyyyy (2010-06-08 20:37) 

Ｈしてお金もらえるって最高だな！！！！
ぶっちゃけテキトーにやっても月30万越えとか余裕だし(笑)

もう仕事辞めて、これ一本で食ってくわ！！！！(*￣ー￣)v
http://dcrcdku.fukushima.coresy.net/dcrcdku/
by 某ドカタ (2011-04-02 17:07) 

出会いの季節っしょ♪
一人暮らしの女とかマジですぐポンポン落ちておもしれーｗｗ
お姉さん美味しかったです（＾ｑ＾）
http://20bhh5-.www.sofban.info/20bhh5-/
by 春野 (2011-04-09 11:34)