input [type = 'text'] Le sélecteur CSS ne s'applique pas aux entrées de texte de type par défaut?

Question

Le type d'entrée par défaut est 'text'. J'ai toujours supposé alors que les déclarations CSS ciblant input[type='text'] auraient une incidence sur ces entrées même si le type n'était pas explicitement déclaré sur le contrôle. Cependant, je viens de remarquer que mes entrées de texte de type par défaut ne comprennent pas les styles. pourquoi est-ce le cas?

CSS:

 input[type='text']
{
background:red;
}
 

HTML:

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

http://jsfiddle.net/LhnNM/

Answer 1

Le CSS utilise uniquement les données dans l'arborescence DOM, qui a peu à voir avec la façon dont le moteur de rendu décide quoi faire avec des éléments avec des attributs manquants.

Afin de laisser le CSS refléter le HTML

input:not([type]), input[type="text"]
{
background:red;
}

ou faire de l'HTML explicite.

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

Si ce n'était pas le faire, vous ne seriez jamais capable de distinguer entre

element { ...properties... }

et

element[attr] { ...properties... }

parce que tous les attributs seraient toujours être défini sur tous les éléments. (Par exemple, table a toujours un border attribut, avec 0 pour un défaut.)

Answer 2

Parce que ce n'est pas censé faire ça.

input[type=text] { } est un sélecteur d'attribut, et sélectionne uniquement cet élément, avec l'attribut correspondant.

Answer 3

Par les spécifications CSS, les navigateurs peuvent ou ne peuvent pas utiliser les informations sur les attributs par défaut, la plupart ne le sont pas. La clause pertinente dans le CSS 2.1 spec est 5.8.2 valeurs d'attribut par Défaut dans la Dtd. Dans les Sélecteurs CSS 3, c'est la clause 6.3.4, avec le même nom. Il recommande: "Sélecteurs doit être conçu de sorte qu'ils travaillent ou non les valeurs par défaut sont inclus dans le document de l'arbre."

Il est généralement préférable de spécifier explicitement les attributs essentiels tels que l' type=text au lieu de retomber entre eux. La raison en est qu'il n'est pas simple moyen fiable pour se référer à l' input des éléments avec la souffrance type d'attribut.

Answer 4

Pour être compatible avec tous les navigateurs, vous devez toujours déclarer le type d'entrée.

Certains navigateurs considèrent le type par défaut comme "texte", mais ce n'est pas une bonne pratique.

Cordialement,

javier

Answer 5

essaye ça

  input[type='text']
 {
   background:red !important;
 }