Maison > interface Web > tutoriel CSS > Partage de notes sur l'utilisation de display:aucun en CSS

Partage de notes sur l'utilisation de display:aucun en CSS

黄舟
Libérer: 2017-07-24 09:41:08
original
2047 Les gens l'ont consulté

Le style display:none est souvent utilisé lors du codage du frontend des pages Web. Lors de l'utilisation quotidienne, nous constatons qu'il y a plusieurs fonctionnalités auxquelles il faut prêter attention

Si vous utilisez directement l'affichage. :aucun pour les éléments du fichier de style ou du code du fichier de page Après avoir masqué, après avoir chargé la page, sans définir le style via js pour afficher l'élément, l'utilisation du code js ne pourra pas obtenir correctement certains attributs de l'élément, tels que offSetTop , offSetLeft, etc., et la valeur renvoyée sera 0. Grâce à js Ces valeurs peuvent être obtenues correctement après avoir défini style.display pour que l'élément soit affiché.

2. Les éléments masqués à l'aide de display:none ne seront pas récupérés par les sites de recherche tels que Baidu, ce qui affectera le référencement du site Web. Dans certains cas, left:-100000px peut être utilisé pour obtenir le même effet. .

3. Si vous définissez le style display:none d'un élément via un fichier de style ou , la définition de style.display="" avec js ne fera pas afficher l'élément. Vous pouvez plutôt utiliser un bloc ou une valeur équivalente en ligne. Les paramètres directement sur l'élément via style="display:none" n'auront pas ce problème

4. Dans certains cas, style.visibility peut être utilisé à la place de style.display, mais il convient de noter ce style. visibilité Lors du masquage d'un élément, l'espace occupé par l'élément sur la page est conservé, tandis que style.display masque l'élément et cède l'espace qu'il occupe sur la page.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal