Выбор отмеченного элемента в CSS [дубликаты]

Question

Выбор отмеченного элемента в CSS [дубликаты]

0

У меня проблема с выбором элемента внутри выпадающего списка. Вот скрипка: http://jsfiddle.net/H656H/

<select id="razred" name="razred">
            <option hidden selected><?php echo $razred; ?></option>
            <option>1.A</option>
            <option>1.B</option>
            <option>1.C</option>
            <option>1.Č</option>
            <option>1.D</option>
            <option>1.E</option>
            <option>2.A</option>
            <option>2.B</option>
            <option>2.C</option>
            <option>2.Č</option>
            <option>2.D</option>
            <option>2.E</option>
            <option>3.A</option>
            <option>3.B</option>
            <option>3.C</option>
            <option>3.Č</option>
            <option>3.D</option>
            <option>3.E</option>
            <option>4.A</option>
            <option>4.B</option>
            <option>4.C</option>
            <option>4.Č</option>
            <option>4.D</option>
            <option>4.E</option>
        </select><br />

Итак, я хочу стилить элемент после того, как пользователь нажмет на него. Таким образом, только когда пользователь выбирает свой выбор, он получает стилизацию. Я думаю, что должен быть какой-то псевдоселектор CSS для этого выбранного элемента внутри выпадающего списка. Есть ли какие-либо селектор CSS для этого?

Спасибо вам всем!

Blaz Kranjcev 27 нояб. 2013, в 20:35

Источник

0

Какой элемент вы пытаетесь стилизовать?
Lloyd Banks 27 нояб. 2013, в 19:14
0

Элементы внутри #razred выпадающего списка. На самом деле все с <option> .
Blaz Kranjcev 27 нояб. 2013, в 19:22

Теги:

html

css

drop-down-menu

selector

3 ответа

0

Селектор фокуса сделает что-то близкое к тому, что вы ищете

#razred:focus{
    color: blue;
}

Обновленная скрипка

Lloyd Banks 27 нояб. 2013, в 17:38

0

Задача решена. Это работает сейчас, спасибо!
Blaz Kranjcev 27 нояб. 2013, в 20:02

0

Изменение: удалена некорректная часть ответа.

Ответ на ваш фактический вопрос относительно css:

Из предыдущего вопроса

#razred option:checked { color: red; }

echochamber 27 нояб. 2013, в 16:16

0

Нет ничего плохого в разметке ОП. Если значение не указано, содержимое внутри тега параметра отправляется вместе с отправкой формы.
cimmanon 27 нояб. 2013, в 19:19
0

@ cimmanon О, не знал этого. Благодарю. Отредактировано, чтобы показать только правильную часть ответа :).
echochamber 27 нояб. 2013, в 19:20

Ещё вопросы

Какой элемент вы пытаетесь стилизовать?
Элементы внутри #razred выпадающего списка. На самом деле все с <option> .
Задача решена. Это работает сейчас, спасибо!
Нет ничего плохого в разметке ОП. Если значение не указано, содержимое внутри тега параметра отправляется вместе с отправкой формы.
@ cimmanon О, не знал этого. Благодарю. Отредактировано, чтобы показать только правильную часть ответа :).

walmik · Accepted Answer · 2013-11-27T17-13-00.000Z

Нет псевдоселектора для выбора полей выбора, как вы себе представляете. Итак, ответ на ваш исходный вопрос: No :(

Но если вы не возражаете использовать крошечный бит JavaScript, вы можете эмулировать желаемую функцию. Вы можете добавить класс в поле выбора метода обмена. В идеале это должно быть сделано из нижней части страницы внутри тега скрипта. Я делаю это inline только как демо:

<select id="razred" name="razred" onchange='this.className="visited"'>

И тогда вы можете просто определить пользовательский класс так, как вы хотите

.visited {
    color: #f00;
    -webkit-appearance: none;  /*required for webkit based browsers*/
}

JSFiddle: http://jsfiddle.net/9K5h2/1