Может a:: перед селектором использоваться с <текстовая область>?
Я экспериментирую с некоторыми стилями на <textarea>s и я пытался делать некоторый материал с ::before и ::after селекторы и я не могли ни к чему, чтобы заставить их работать. Таким образом, вопрос: действительно ли это возможно? Я знаю, что CSS, окружающий формы, является тайным вне упоминания, но кажется, что это должно работать.
1 ответ
: before и : after не будут работать с текстовой областью (ни с любым элементом, который не может содержать другой элемент, такой как img или input ), потому что сгенерированное содержимое псевдоэлемента помещается в элемент, но перед или после содержимого этого элемента и действует как элемент. Псевдоэлемент не размещается до или после самого родительского элемента (вопреки некоторой информации, которую можно найти в Интернете). Для иллюстрации:
Если у вас есть этот css:
p:before {content: 'before--'}
p:after {content: '--after'}
Тогда html, как это:
<p>Original Content</p>
Эффективно отображает на экране , как если бы исходный код был:
<p>before--Original Content--after</p>
Не как если бы исходный код был:
before--<p>Original Content</p>--after
Вот почему теги, которые не могут содержать какой-либо html элемент «контент» (например, упомянутые выше), не распознают псевдоэлементы, поскольку нет «места» "для этого контента, который будет создан. Текстовое поле может содержать «контент», но только чистый текстовый контент.