3

是否可以通过 CSS 类设置标签的selected属性？option

我想知道样式表中是否可能出现以下内容：

option.selected {
  selected: true;
}

然后在 HTML 中：

<option class="selected">

这与设置selected属性具有相同的效果。这种技术可行吗？

4

6 回答 6

13

不，CSS 只改变表示，而不是内容（尽管 CSS3 确实支持对内容进行一些修改，但不支持值的选择。）如果不能直接修改 HTML，则需要使用 JavaScript。

于 2009-07-13T21:04:34.793 回答
2

不是通过 CSS，但可以通过 javascript 完成。 

function setSelects() {

    var allSelects = document.getElementsByTagName("select");
    for (var i = 0; i < allSelects.length; i++) {
        for (var j = 0; j < allSelects[i].options.length; j++) {
            if (allSelects[i].options[j].className == "selected") {

                allSelects[i].selectedIndex = j;
            }
        }
    }
}

window.onload = setSelects;

正如其他人指出的那样，我不确定您为什么首先要通过 CSS 类来实现。

于 2009-07-13T21:07:01.107 回答
2 
option[selected] {background-color:skyblue;color:white;}

如果您想显示先前标记的选择 - 在显示结果后独立于用户的更改，旧的选择保持 sykblue，新的更改为深蓝色。

于 2011-03-29T08:19:28.383 回答
1

如果您使用 JQuery，那么您可以在这些方面做很多事情，但不能单独使用 CSS。

于 2009-07-13T21:04:11.890 回答
1

是的，这是可能的，但我不确定 IE

下面的代码将更改默认选定项目的样式。

           <style>
           option[selected="selected"] {
           color:red;
           font-weight:bold
           }
           </style>

           <select>
           <option value="1">Txt</option>
           <option value="2" selected="selected">Another Txt</option>
           </select>
于 2012-11-26T05:12:31.000 回答
0

Selected 不是 CSS 属性。请参阅http://www.w3.org/TR/CSS2/propidx.html上的规范。

于 2009-07-13T21:08:29.917 回答