Кратко
СкопированоПсевдокласс :read показывает что элемент, например, <input> или <textarea>, изменяется.
Пример
СкопированоПсевдокласс :read показывает, что поле ввода можно изменить.
<form> <label for="input-field">Зима близко</label> <input id="input-field" type="text"></form>
<form>
<label for="input-field">Зима близко</label>
<input id="input-field" type="text">
</form>
input:read-write { border: 1px solid blue;}
input:read-write {
border: 1px solid blue;
}
Как и другие селекторы псевдоклассов, :read может использоваться с другими псевдоэлементами и псевдоклассами.
textarea:read-write:focus { box-shadow: 0 5px 10px gray;}textarea:read-write::before { content: "Что-то меняется..."; color: #aaa;}
textarea:read-write:focus {
box-shadow: 0 5px 10px gray;
}
textarea:read-write::before {
content: "Что-то меняется...";
color: #aaa;
}
Как пишется
СкопированоЭлементы, к которым применяется псевдокласс :read:
<input>— элементы любого типа, с возможностью редактирования и доступные не только для чтения. Это означает что у них не установлены атрибуты:readили- only disabled.<textarea>— элементы доступны для изменения (без атрибутов:readили- only disabled).- Любой элемент не
<input>и не<textarea>, у которого установлен атрибут contenteditable.
После элемента из списка выше ставим двоеточие и пишем ключевое слово read.
input:read-write,input:-moz-read-write { border: 1px solid red;}
input:read-write,
input:-moz-read-write {
border: 1px solid red;
}
Псевдокласс :read поддерживается в Chrome, Safari и Opera. Firefox поддерживает псевдокласс со специальным префиксом -moz.