ヤプログ・記事の背景色変更&背景画像の指定2 長靴猫...★ 旧オロルンのヤプログ講座





↓--------

スポンサーサイト

 スポンサー広告



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


↓2005-11-12

ヤプログ・記事の背景色変更&背景画像の指定2

 ヤプログ講座



記事の背景色をかえたり、背景に画像を指定したりします。
この方法だと、コメントやTB部分に背景がつきません

メインテンプレート・アーカイブテンプレート・一記事テンプレート・スタイルシートをいじります
いまからカスタマイズに入るので、バックアップを取って、メモ帳に移した状態にしてください
参考→カスタマイズの基礎


まず、メインテンプレートの真ん中よりちょっと上辺りの

<td class="entry_text">★ここ★<div class="entry_layer">

<div class="kiji_haikei"> と書き、その少し下の

</BlogEntryIfExtended>★ここ★
  </td>

</div> と書き、

<td class="entry_text"><div class="kiji_haikei"> <div class="entry_layer">
~省略~
</BlogEntryIfExtended></div> 
</td>

となるようにします。これをアーカイブテンプレートにも行います。


さらに一記事テンプレートの
<td class="entry_text">★ここ★<div class="entry_layer">

<div class="kiji_haikei"> と書き、その少し下の

{$BlogEntryExtend$}</div>★ここ★</td>

</div> と書き、

<td class="entry_text"><div class="kiji_haikei"> <div class="entry_layer">
~省略~
{$BlogEntryExtend$}</div></div></td>

となるようにします。



★画像指定の場合

スタイルシートの一番最後か最初に

.kiji_haikei
{
OVERFLOW: no;
background:url(ここに画像のアドレス);
WIDTH: 100%;
}

と書きます



.kiji_haikei
{
OVERFLOW: no;
background:url(ここに画像のアドレス);
WIDTH: 100%;
}

背景画像を一列に並べたり、一箇所に固定したい方はコチラ


★色指定の場合

スタイルシートの一番最後か最初に

.kiji_haikei
{
OVERFLOW: no;
background:カラーコードやカラーネーム;
WIDTH: 100%;
}

と書きます



.kiji_haikei
{
OVERFLOW: no;
background:#fc0;
WIDTH: 100%;
}

色指定(カラーコードとカラーネーム)

注意:この方法だと下から1cmぐらいのところが空白になって、背景が下にぴったり引っ付きません。
ぴったりさせたい方はhttp://yaplog.blog25.fc2.com/blog-entry-12.htmlを参考にしてください



講座の目次


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