css méthode la plus courante pour « enlever » texte à partir d'éléments utilisait text-indent: -9999px, mais maintenant j'ai lu qu'il est préférable d'utiliserimage dans
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
de sorte que le navigateur ne pas créer ce 9999px boîte. Mais pourquoi ne pouvons-nous pas simplement utiliser font-size: 0? Quel est le problème avec cette méthode?
C'est vraiment à vous de voir. Personnellement, j'utilise aussi le texte-indent comme titre, donc pendant que la page charge le document CSS, le texte sera un espace réservé jusqu'à ce que le CSS soit chargé. Aussi chaque fois que je fais 'text-indent: -9999px' je ne vois aucun changement de performance. Fondamentalement, il n'y a pas vraiment de désavantage considérable en utilisant 'font-size: 0' ou 'text-indent: -9999px', ils fonctionnent tous deux aussi bien.
qui a fait pas répondre à la question de OP. –
Ok, merci pour la réponse. Je suppose qu'il n'y a pas de problème de performance notable avec l'utilisation de 'text-indent: -9999px', c'est juste quelque chose que j'ai lu. Je suppose que 'text-indent: -9999px' est meilleur car' font-size: 0' peut réduire la hauteur des éléments, si elle n'est pas prédéfinie. – zmuci
Différents navigateurs le gèrent différemment, et il y a trop de variantes pour que je puisse les lister. Certains problèmes courants sont les navigateurs qui ne savent pas quoi faire avec une règle comme font-size:0 et affichent le texte comme si aucune règle de taille de police n'avait été écrite. Dans d'autres situations, le texte pourrait être encore visible, mais pas tout ce qui est lisible. Alors que les autres navigateurs (mozilla, netscape7) font ce que vous voulez et n'affichent pas le texte
Sans test font-size:0 Je suppose que la marge et les paddings sont toujours visibles, bien que ce soit probablement un problème dans les deux cas.
Personnellement, je dirais même utiliser rgba et réglez l'opacité à 0.0 avant d'essayer font-size:0
J'ai essayé 'font-size: 0' dans tous les navigateurs modernes + IE8 + safari pour windows et ça fonctionnait presque parfaitement partout (la hauteur de l'élément était réduite dans IE8). Je suppose que cela pourrait ne pas fonctionner dans les anciens navigateurs, mais soyons honnêtes, nous ne nous soucions pas des anciens navigateurs (IE8). Et je pense que 'rgba' n'est pas meilleur quand il est comapred à' font-size: 0' puisque IE8 ne supporte même pas 'rgba', non? – zmuci
points très justes en fait, même si j'ai googlé abit pour plus d'exemples et ici: http://webdesign.about.com/od/fonts/qt/tipfont0.htm. "IE pour Mac et Safari: le texte est affiché à la taille par défaut comme s'il n'y avait pas de propriété de taille de police". Bien que je ne sois pas sûr quand l'article est de – NachoDawg
https://css-tricks.com/video-screencasts/142-hiding-things-with-css/ –