css - CSS クラスの再利用 / 自動入力

Question

私はCSSクラス名を持っていると言います

div.TestClass
{
     float:left;etc//
}

span.SpanTestClass
{
     float:right;etc//
}

私のフォームには、多くのスパンと div があります。

新しいスパンまたは div を作成するときにすべてを入力する代わりに、スパンと div のすべてのクラスを実装する簡単な方法はありますか? これの代わりに：

<span id=span1 class=SpanTestClass></span>
<span id=span2 class=SpanTestClass></span>
<span id=span3 class=SpanTestClass></span>
<span id=span4 class=SpanTestClass></span>

そのようです：

<div id="someDiv" class="someclass">
<span id=span1></span>
<span id=span2></span>
<span id=span3></span>
<span id=span4></span>
</div>

乾杯

Answer 1

CSS

.someDiv{
color:#353535;
}

.someDiv span{
font-weight:bold;
color:red;
}

HTML

<div class="someDiv">

Hello <span>World!</span>

</div>

クラスとして 'someDiv' を使用する div 内のスパン タグには、赤 + 太字のテキストが表示されます。

Answer 2

親要素から子要素にIDとクラスを適用する方法はありません。これは、あなたが求めていることだと思います。必要な理由もありません。

HTML：

<div id="divid" class="divclass">
    <span class="otherclass"> ... </span>
    <span class="otherclass"> ... </span>
    <span> ... </span>
    <span> ... </span>
    <a href="#" class="otherclass"> ... </a>
</div>

この特定のdivのすべての要素をターゲットにする場合：

#divid * {
    ...
}

この特定のdivのすべてのスパンをターゲットにする場合：

#divid span {
    ...
}

この特定のdiv内のすべての要素をotherclassのクラスでターゲットにする場合：

#divid .otherclass {
    ...
}

他のクラスのクラスを使用して、この特定のdivのスパンのみをターゲットにする場合：

#divid span.otherclass {
    ...
}

（dividを持つものだけでなく）divclassですべてのdivをターゲットにする場合は、上記のすべてで単にに置き換え#dividます.divclass。

Answer 3

はい、スパンをターゲットにすることができます

#someDiv span {
   //
}