Как я могу использовать псевдоэлемент CSS: before {content: ''} для воздействия на элемент

Если у меня есть список опций, как я могу использовать псевдоэлемент CSS: before {content: ''}, чтобы повлиять на ? Ниже приведены три варианта, и я бы хотел вставить текст перед каждым из них.

Я знаю, что это можно сделать с помощью javascript / jQuery, но возможно ли это с помощью CSS?

<html>
<head>
    <style>

        option::before {
            content: "sandy - "
        }

    </style>


</head>
<body>

<select>
    <option>beach</option>
    <option>field</option>
    <option>carpet</option>
</select>


</body>
</html>
12
задан BoltClock 8 February 2012 в 17:49
поделиться