Тип ввода по умолчанию - "текст". Я всегда предполагал, что объявления CSS, ориентированные на input[type='text'], повлияют на эти входы, даже если тип не был явно объявлен в элементе управления. Тем не менее, я только заметил, что мои текстовые вложения по умолчанию не получают стили. Почему это так? И как я могу это решить?
input[type='text']
{
background:red;
}
<input name='t1' type='text'/> /* Is Red */
<input name='t1'/> /* Is Not Red */
CSS использует только данные в дереве DOM, что мало связано с тем, как рендеринг решает, что делать с элементами с отсутствующими атрибутами.
Итак, пусть CSS отражает HTML
input:not([type]), input[type="text"]
{
background:red;
}
или сделать HTML явным.
<input name='t1' type='text'/> /* Is Not Red */
Если это не так, вы никогда не сможете отличить
element { ...properties... }
и
element[attr] { ...properties... }
потому что все атрибуты всегда будут определены для всех элементов. (Например, table всегда имеет атрибут border, а 0 - по умолчанию.)
По спецификациям CSS браузеры могут использовать или не использовать информацию об атрибутах по умолчанию; в основном не. Соответствующее предложение в спецификации CSS 2.1 5.8.2 Значения атрибутов по умолчанию в DTD. В CSS 3 Selectors его предложение 6.3.4 с тем же именем. Он рекомендует: "Селекторы должны быть сконструированы так, чтобы они работали независимо от того, включены ли значения по умолчанию в дерево документов".
Как правило, лучше явно указывать основные атрибуты, такие как type=text вместо их дефолта. Причина в том, что нет простого надежного способа ссылки на элементы input с дефолтным атрибутом type.
Потому что это не предполагается.
input[type=text] { } - это селектор атрибутов и будет выбирать только этот элемент с соответствующим атрибутом.
Чтобы быть совместимым со всеми браузерами, вы всегда должны указывать тип ввода.
Некоторые браузеры будут использовать тип по умолчанию как "текст", но это не очень хорошая практика.
попробуйте это
input[type='text']
{
background:red !important;
}