ブログの背景画像をどれにするか迷って中々決められない

【カテゴリ：パソコン　ブログカスタマイズの記録】

このブログの背景画像なのですが、候補がたくさんあり、どれにするか中々決められずにいます。

約10種類くらいに絞ったのですが、まだ迷っており、時々変更しています。

比較する際に、いちいちブログ管理画面からデザインの CSS（＝スタイルシート）を変更するのも面倒なので、数日くらい前に以下のようなコンテンツをサイドバーに設置しました。



9種類のサンプル画像を表示しており、いずれかのサンプル画像をクリックすると、このブログの背景がその画像に置き換わるようになっています。

スポンサーリンク

即興であり、わずか数分程度の短時間でパッと作った割には、かなり便利に使えてます。

内容は、自由形式のコンテンツに以下のようなコードを貼り付けただけです。（大半が画像のURLです。）

<div class="sidetitle">背景画像の変更</div>
<div class="side" align="center" style="padding:15px 5px 15px 5px" >

<TABLE cellspacing="0" cellpadding="1" border="0" width="200" bgcolor="#c0c0c0">
<tr>
<td><img src="https://kingpcfx.up.seesaa.net/image/diamond_upholstery.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/diamond_upholstery.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/gplaypattern.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/gplaypattern.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/light_checkered_tiles.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/light_checkered_tiles.png)'"></td>
</tr>
<tr>
<td><img src="https://kingpcfx.up.seesaa.net/image/hexellence.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/hexellence.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/grey.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/grey.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/plaid.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/plaid.png)'"></td>
</tr>
<tr>
<td><img src="https://kingpcfx.up.seesaa.net/image/white_paperboard.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/white_paperboard.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/fabric_plaid.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/fabric_plaid.png)'"></td>
<td><img src="https://kingpcfx.up.seesaa.net/image/noise_pattern_with_crosslines.png" width="66" height="66" onClick="document.body.style.backgroundImage='url(https://kingpcfx.up.seesaa.net/image/noise_pattern_with_crosslines.png)'"></td>
</tr>
</TABLE>

</div>

スタイルシートについては、まだまだよく分かっていないのですが、すごく複雑そうなことが、簡単なコードでできてしまったりとか驚く事がいっぱいです。

ところで、背景画像なのですが、参考までに自分は全て以下のサイトから取得しました。

Subtle Patterns | Free textures for your next web project:
http://subtlepatterns.com/



ほとんどがシンプルでクールな画像ですが、きっと気に入った画像が見つかると思います。

以上です。

スポンサーリンク