2011年01月18日

【第37回】コメント欄に枠線を設定する

今回は、コメント欄に枠線を付けてみたいと思います。

前回ご紹介した通り、Seesaaブログのコメント欄はご覧のような構成になっています。

SD_036_02.jpg

今回は、この中のB.comments-bodyクラスにオレンジ色の破線で枠線を設定してみましょう。

★コメント欄の各コメントに枠線を設定する方法★

.comments-bodyクラスにborder系のプロパティを設定する。

▼▼▼ 変更前 ▼▼▼
.comments-body {
margin:0px;
padding:0px;
}

▼▼▼ 変更後 ▼▼▼
.comments-body {
margin:0px;
padding:0px;
border:1px dashed #FF9900;
}

これで、各コメントの周りに枠線が付きました。

▼▼▼ 変更前 ▼▼▼
SD_036_01.jpg

▼▼▼ 変更後 ▼▼▼
SD_037_01.jpg

・・・うーん、かっこ悪い。

今回の枠線を付けるという作業はこれで完了ですが、あまり見た目が良くありませんね。
この記事が書き終わったら、このスタイルシートの適用は除外することにします。

なお、border系のプロパティについては第5回に詳しく記載しているので、そちらも併せてご覧下さい。

▼▼▼▼▼▼▼▼▼▼▼▼▼
参考になりましたら
クリック&応援をお願いします
にほんブログ村 ブログノウハウへ
▲▲▲▲▲▲▲▲▲▲▲▲▲

【PR】FXシステムトレードで着実に利益を重ねる長期資産運用方法o(^0^)o ほくほくFX
【PR】日々の運用成績やユーザーの情報満載のブログo(^0^)o ほくほくポートフォリオ
posted by o(^0^)o ほくほく at 20:00| Comment(0) | PCブログデザイン | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。