0

element1element2の2つのHTML要素があるとしましょう。それらは動的に作成されるため、IDを使用できません。

<element1 class='class1' selected="true" ...[other_attributes]...>
<element1 class='class1' selected="true" ...[other_attributes]...>
<element1 class='class1' selected="false"...[other_attributes]...>
.................................................................
{other <element1> elements}
.................................................................
<element2 class='class2' selected="true" ...[other_attributes]...>
<element2 class='class2' selected="false"...[other_attributes]...>
.................................................................
{other <element2> elements}

ここで、私がやりたいのは、element1とelement2に同じ属性(selected)を使用し、element1でselected = "true"の場合は1つのcssを、element2でselected="true"の場合は異なるcssを使用することです。多分次のようなものです:

[selected=true]
{
  color.red
}

[selected = true]
{
    color.green
}

ただし、HTMLが別の要素に割り当てるcssを認識できるようにしたいと思います。

私は十分に明確だったと思います。

どうすればよいですか?

4

3 に答える 3

2

それがあなたが使用している要素と同じである場合、これは何のためのものclassesであり、そのIDs目的は次のとおりです。

<element id="ID1" class="red" selected="true">
<element id="ID2" class="green" selected="true">

使用IDs:

element#ID1[selected=true]
{
    color:red;
}

element#ID2[selected=true]
{
    color:green;
}

使用classes:

element.red[selected=true]
{
    color:red;
}

element.green[selected=true]
{
    color:green;
}

は一意であるIDs必要がありますが、好きなだけ多くの要素で使用できます。classes

編集:変更された質問に基づいて:

element.class1[selected=true]
{
    color:red;
}

element.class2[selected=true]
{
    color:green;
}

または、親に基づいて作成することもできます (親が異なる場合):

parent#ID1 element[selected=true] { ... }
parent#ID2 element[selected=true] { ... }
于 2013-03-08T15:51:09.547 に答える
0

これを使って:

element1[selected="true"]
              {
  color:red
}

element2[selected="true"]
             {
color:green
}
于 2013-03-08T16:09:24.747 に答える