2007年11月01日

スタイルシートで写真に枠を付ける方法

今日は朝っぱらからちと重い仕事。

緊張感が漂う時間を過ごしたが、何とかうまくこなすことが出来たと思う。後は良い結果につながれば万々歳だが、どうなることやら。

昨日、さくらのブログの写真にスタイルシートで枠を付けれるように既存のスタイルシートにクラスを追加したのだが、その方法だといちいち写真を貼り付けた際にクラスを追加して記述せねばならず、面倒くさい。

うまい方法はないかねぇ、と思ってブログのソースを眺めてみると、ブログの本文はどうやらblogというクラスで囲われているようだ。
っつーことは、blogというクラスに要素名を入れ子にしちゃえばいいわけだ。

そこでさっそく昨日追加したクラスは削除して、新たに下記の記述を追加してみた。

.blog img{
padding:5px 5px;
background-color:#ffffff;
border-color:#dddddd #aaaaaa #aaaaaa #dddddd;
border-width:1px;
border-style:solid;
}

こう記述すると、blogというクラス名で囲われたソースのすべてのimgタグに対してスタイルシートが適用される。

これでめでたく本文に貼り付けた写真には、すべて枠が付くようになった。
posted by みっちー at 23:58 | Comment(0) | TrackBack(1) | ウェブ・HP


この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

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


※画像の中の文字を半角で入力してください。
この記事へのトラックバックURL
http://blog.sakura.ne.jp/tb/6397290
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック

ホームページ作成スタイルシート
Excerpt: ホームページ作成スタイルシート
Weblog: ホームページ作成スタイルシート
Tracked: 2007-11-16 23:46