input[type= 'text'] селектор CSS не применяется к текстовым входам по умолчанию?

Question

input[type= 'text'] селектор CSS не применяется к текстовым входам по умолчанию?

тип ввода по умолчанию является "текст". Я всегда предполагал, что CSS объявления таргетинга input[type='text'] повлияет на эти входные данные, даже если тип не был явно объявлен в элементе управления. Однако я только что заметил, что мои текстовые входы по умолчанию не получают стили. Почему так происходит? И как я могу решить эту проблему?

input[type='text'] {

  background: red;

}

<input name='t1' type='text' /> /* Is Red */

<input name='t1' /> /* Is Not Red */

781 5

css css-selectors

5 ответов:

Comments

Ничего не найдено.

Mr Lister · Accepted Answer · 2012-03-07 23:18:22

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 всегда

Jukka K. Korpela · Accepted Answer · 2012-03-07 17:24:14

по спецификациям CSS браузеры могут или не могут использовать информацию об атрибутах по умолчанию; в основном это не так. соответствующее предложение в спецификации CSS 2.1 -5.8.2 значения атрибутов по умолчанию в DTDs. В CSS 3 селекторы, это предложение 6.3.4, С тем же именем. Он рекомендует: "селекторы должны быть разработаны таким образом, чтобы они работали независимо от того, включены ли значения по умолчанию в дерево документов."

обычно лучше всего явно указать essential атрибуты, такие как type=text вместо того, чтобы возвращаться в них. Причина в том, что нет простого надежного способа обратиться к input элементы с дефолтными .

Starx · Accepted Answer · 2012-03-07 17:08:08

потому, что это не должен сделать это.

input[type=text] { } является селектором атрибутов и будет выбирать только те элементы, с соответствующим атрибутом.

aguante · Accepted Answer · 2015-06-20 21:55:01

чтобы быть совместимым со всеми браузерами, вы всегда должны объявлять тип ввода.

некоторые браузеры будут принимать тип по умолчанию как "текст", но это не очень хорошая практика.

azzeth_alhavizh · Accepted Answer · 2013-12-23 21:08:59

попробуй такое
 input[type='text']
 {
   background:red !important;
 }