解決済

プラグインとブログ本文の間に区切り線をつけたい。

Splashed Ink を使用しています。
AプラグとBプラグの間に入っているのと同じ線をBプラグと本文の間にも入れたいと思います。
CSS,トップページなど見ましたがどこで設定しているのか分かりませんでした。
よろしくお願いします。

2006-05-19 23:47の質問
ブログ  プラグイン    本文  プラグ        
ブログ
ブログ のかわいいポータルサイト ヤプログ!
www.yaplog.jp/
この質問と回答を読んで役に立った場合は「役に立つ質問」に投票してください。投票が多い質問は、役に立つ質問一覧に掲載され、より多くの人に見てもらうことができます。
Ads By Google

回答(1)

1.

2006-05-20 19:06:40ベスト
サイドバーAとサイドバーBの間に入っている線は、画像です。
(というか、背景全体が画像)
スタイルシートの
#blogcontainer{
	width:875px;
	text-align:center;
	margin:0 auto;
	background:url(http://parts.blog.livedoor.jp/img/usr/
		splashed_ink/base.gif) repeat-y 0 0%;
}
の部分のbackground:url( )の、( )の中が画像のURLです。

高さ4px、幅は目一杯の875pxある、ほぼ白いだけの画像ですが、途中に4pxの高さの線があります。
これをブログ本体の上から下まで敷き詰めることで、線を描いています。

これと同じように、もう一本線を足すのは簡単です。
先程の画像に、もう一つ、印のような線の一部を書き入れて、アップロードし、そのURLを、スタイルシートの同じところ
#blogcontainer{}の中のbackground:url( )の中のURLと取り替えれば良いだけです。
一度やってみれば、あまりに簡単で、驚くかも知れません。
回答レベル : 回答
Ads By Google

コメント(4)

#1.  J36
2006-05-20 21:58:19

A・Bプラグインのどちらかに設定がされているものとばかり思いこんで探していました。
線を入れることは出来ましたが、上部のタイトル部分にも線が入ってしまうので調整中です。
詳しい解説をありがとうございました。

#2.  AQ♪
2006-05-20 22:08:46

>>1
背景画像の加工は思いつかなかったです。^^;

簡易な方法としては、CSS のB ( 右 ) カラムに該当する部分に新しく線が出るように記述する事でしょうか ・・・。

ただしこの方法は、プラグインの入っている高さしか線が下まで伸びていかないから、見映えとすれば画像を加工するほうが良いと思われます。参考に回答しておきます。

管理画面に入って、カスタマイズ/管理 > デザインの設定 > カスタマイズ > を順にクリックしていくと CSS と 4つ の HTML のページが出てきます。その中の CSS の記述を変更します。

CSS の中の、#right{ } の中の margin を書き換え、そして新たに線が出るように追記します。このような感じです。↓ 現在のものと差し替えて下さい。

#3.  AQ♪
2006-05-20 22:09:00

#right{
float:right;
width:180px;
margin:0px 5px 0px auto;
border-right:1px solid #CCCCCC;
}

CSS を保存。CSS の再構築をかけて下さい。閲覧しているブラウザーをリロード ( 再読み込み ) すれば反映されています。

#4.  J36
2006-05-21 14:10:41

AQ さん

こちらの方法も試してみました。
画像加工の手間がないのでかんたんでした。
どちらもまだ少し試行錯誤中ですが思っている状態に近づけそうです。
ありがとうございました。

トラックバック

トラックバックURL: