Comment supprimer les flèches de l'entrée[type= "nombre"] dans Opera [dupliquer]
cette question a déjà une réponse ici:
- puis-je cacher la boîte de spin de l'entrée du nombre HTML5? 14 réponses
je cherche juste à enlever ces flèches, pratique dans certaines situations.
je tiens à préserver la conscience du navigateur du contenu étant purement numérique. Donc le changer en input[type="text"] n'est pas une solution acceptable.
maintenant que Opera est basé sur webkit, cette question est un dulpicate de: puis-je cacher la boîte de spin de l'entrée du nombre HTML5?
3 réponses
j'ai utilisé quelques CSS simples et il semble de les enlever et de travailler très bien.
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
}
ce tutoriel de CSS trucs explique en détail et montre aussi comment les styliser
ces flèches font partie du Shadow DOM , qui sont essentiellement des éléments DOM sur votre page qui vous sont cachés. Si vous êtes nouveau à l'idée, une bonne introduction lire peut être trouvé ici .
la plupart du temps, le Shadow DOM nous fait gagner du temps et est bon. Mais il y a des cas, comme cette question, où vous voulez la modifier.
vous pouvez les modifier dans Webkit maintenant avec le droit des sélecteurs , mais c'est encore dans les premiers stades de développement. Le DOM Shadow lui-même n'a pas encore de sélecteurs unifiés, donc les sélecteurs webkit sont propriétaires (et il ne s'agit pas seulement d'ajouter -webkit , comme dans d'autres cas).
à cause de cela, il semble probable que Opera n'a pas encore eu le temps d'ajouter ceci. Trouver des ressources sur les modifications du DOM Opera Shadow est difficile, cependant. Quelques sources Internet peu fiables j'ai trouvé tout dire ou suggérer que L'opéra ne supporte pas actuellement la manipulation de Shadow DOM.
j'ai passé un peu de temps à regarder sur le site de L'Opéra pour voir s'il y en aurait une mention, en même temps que j'ai essayé de les trouver en Libellule...ni de recherche avait aucune chance. En raison du silence sur cette question, et de la nature évolutive de la manipulation Shadow DOM + Shadow DOM, il semble être une conclusion sûre que vous ne pouvez pas le faire à L'Opéra, au moins pour l'instant.
il n'y a pas moyen.
cette question est essentiellement un duplicata de y a-t-il un moyen de cacher les nouvelles commandes de spinbox HTML5 affichées dans Google Chrome & Opera? mais peut-être pas une copie complète, puisque la motivation est donnée.
si le but est" la connaissance du navigateur du contenu étant purement numérique", alors vous devez considérer ce que cela signifierait vraiment. Les flèches, ou spinners, font partie de rendre l'entrée numérique plus confortable dans certains cas. Une autre partie est de vérifier que le contenu est un nombre valide, et sur les navigateurs qui prennent en charge les améliorations d'entrée HTML5, vous pourriez être en mesure de le faire en utilisant l'attribut pattern . Cet attribut peut également affecter une troisième caractéristique d'entrée, à savoir le type de clavier virtuel qui peut apparaître.
par exemple, si l'entrée doit comporter exactement cinq chiffres (comme les numéros postaux dans certains pays), alors <input type="text" pattern="[0-9]{5}"> pourrait être adéquat. Il est de mise en œuvre du cours-dépend de la façon dont il sera géré.