- PR -

cssでの疑問　領域の部品を一気に変換することはできるか？

1
投稿者投稿内容
DaikiRyuto
大ベテラン
会議室デビュー日: 2002/07/23
投稿数: 200
投稿日時: 2004-09-29 21:45
cssに関する質問です。
以下のようなhtml文書があるとします。
--------------------------------------------------------------------------
<hr><a href="no0.htm">No.0</a>
<hr><a href="no1.htm">No.1</a>
<hr><a href="no2.htm">No.2</a>
--------------------------------------------------------------------------
このhtmlの（上の）2行目と3行目に当たる部分のスタイルを変更したいと思います。
ただし2行目と3行目は同じスタイルに変更したいとします。
すると、
--------------------------------------------------------------------------
<hr><a href="no0.htm">No.0</a>
<hr style="***"><a href="no1.htm" style="****">No.1</a>
<hr style="***"><a href="no2.htm" style="****">No.2</a>
--------------------------------------------------------------------------
か
--------------------------------------------------------------------------
<hr><a href="no0.htm">No.0</a>
<hr class="hoge1"><a href="no1.htm" class="hoge2">No.1</a>
<hr class="hoge1"><a href="no2.htm" class="hoge2">No.2</a>
--------------------------------------------------------------------------
.hoge1 {
/* ここにhrについて何か書く */
}
.hoge2 {
/* ここにaについて何か書く */
}
--------------------------------------------------------------------------
といったような感じになると思います。
でもこれだと、同じstyle指定やclass定義を2行ともに付け加えないといけません。
そこで、
--------------------------------------------------------------------------<hr><a href="no0.htm">No.0</a>
<div class="hoge">
<hr><a href="no1.htm">No.1</a>
<hr><a href="no2.htm">No.2</a>
</div>
--------------------------------------------------------------------------
.hoge {
/* ここにhrについて何か書く */
/* ここにaについて何か書く */
}
--------------------------------------------------------------------------
といった形で表現できないかと思ったのですが、これは無理なのでしょうか。
cssの概念をよくわかってないので、間抜けな質問かもしれませんが……。
永井和彦
ぬし
会議室デビュー日: 2002/07/03
投稿数: 276
お住まい・勤務地: 東京都
投稿日時: 2004-09-29 21:55
コード:
.hoge hr {
    /* ここにhrについて何か書く */
}

.hoge a {
    /* ここにaについて何か書く */
}

で、いかがでしょうか。
DaikiRyuto
大ベテラン
会議室デビュー日: 2002/07/23
投稿数: 200
投稿日時: 2004-09-29 22:16
ああ、そうやるんですか……。確かに出来ますね。
ありがとうございました。

うわあ、初歩的過ぎることを聞いてしまった予感。
1

スキルアップ／キャリアアップ（JOB@IT）