qu'est-ce qu'une expression CSS

青灯夜游
Libérer: 2023-01-07 11:42:08
original
3481 Les gens l'ont consulté

l'expression css consiste à utiliser expression() après l'attribut css pour connecter une expression JavaScript. La valeur de l'attribut css est le résultat de l'expression JavaScript ; le format de syntaxe est "attribut css : expression (expression JavaScript) ;".

qu'est-ce qu'une expression CSS

L'environnement d'exploitation de ce tutoriel : système Windows 7, CSS3&&javascript version 1.8.5, ordinateur Dell G3.

IE5 et les versions ultérieures prennent en charge l'utilisation d'expressions en CSS pour associer les attributs CSS aux scripts Javascript. Les attributs CSS ici peuvent être des attributs inhérents à l'élément ou des attributs personnalisés.

l'expression CSS consiste à utiliser expression() après l'attribut CSS pour connecter une expression JavaScript. La valeur de l'attribut CSS est le résultat de l'expression JavaScript.

Vous pouvez référencer directement les propriétés et les méthodes de l'élément lui-même dans l'expression, ou vous pouvez utiliser d'autres objets du navigateur. L'expression apparaît comme si elle se trouvait à l'intérieur d'une fonction membre de cet élément.

Vous trouvez que le texte ci-dessus est un peu obscur ? Cela n'a pas d'importance, il vous suffit de savoir : nous pouvons écrire des scripts Javascript dans des fichiers CSS via une expression et l'utiliser pour obtenir des fonctions et des effets très pratiques.

Application d'expression :

1. Attribuez des valeurs aux attributs inhérents aux éléments. L'exemple suivant consiste à positionner un élément en fonction de la taille du navigateur.

    mid.lt263.com/mb  
mb5u.com
Copier après la connexion

2. Attribuez une valeur à l'attribut personnalisé de l'élément

Regardons l'exemple suivant :

    mid.lt263.com/mb  
模板天下 - mid.lt263.com/mb

Copier après la connexion

Explication : L'étoile à l'intérieur est un attribut défini arbitrairement par vous. Vous pouvez la définir comme vous le souhaitez, puis l'inclure. dans expression() L'instruction est un script JS. N'oubliez pas qu'il y a un guillemet entre l'attribut personnalisé et l'expression. Parce que l'essence est toujours CSS, elle est placée dans la balise de style au lieu du script. De cette façon, il est facile d’éliminer la zone de lien en pointillé dans la page en une seule phrase. Ce qui nécessite votre attention particulière : à moins qu'il n'y ait un besoin très particulier d'utiliser une expression, il n'est généralement pas recommandé d'utiliser une expression, car l'expression nécessite des ressources de navigateur relativement élevées.

Remarque :

Les expressions CSS sont un moyen puissant (mais dangereux) de définir dynamiquement les propriétés CSS. Internet Explorer prend en charge les expressions CSS à partir de la version 5. Dans l'exemple ci-dessous, une expression CSS peut être utilisée pour changer la couleur d'arrière-plan toutes les heures :

background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );
Copier après la connexion

Comme indiqué ci-dessus, une expression JavaScript est utilisée dans expression. Les propriétés CSS sont définies en fonction de l'évaluation des expressions JavaScript. La méthode d'expression ne fonctionne pas dans d'autres navigateurs, il est donc utile de la configurer spécifiquement pour Internet Explorer dans une conception multi-navigateurs.

Le problème avec les expressions, c'est qu'elles sont évaluées plus souvent qu'on ne le pense. Non seulement lorsque la page est affichée et zoomée, mais aussi lorsque la page défile et même lorsque la souris est déplacée, elle sera recalculée. Ajoutez un compteur à une expression CSS pour suivre la fréquence à laquelle l'expression est évaluée. Vous pouvez facilement réaliser plus de 10 000 calculs en déplaçant simplement la souris sur la page.

Une façon de réduire le nombre de fois qu'une expression CSS est évaluée consiste à utiliser une expression unique, qui attribue le résultat à un attribut de style spécifié lors de sa première exécution et utilise cet attribut pour remplacer l'expression CSS. Si les propriétés de style doivent changer dynamiquement au cours des cycles de page, l'utilisation de gestionnaires d'événements au lieu d'expressions CSS est une option viable. Si vous devez utiliser des expressions CSS, n'oubliez pas qu'elles sont évaluées des milliers de fois et peuvent avoir un impact sur les performances de votre page.

(Partage de vidéos d'apprentissage :Tutoriel vidéo CSS)

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
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!