Que sont les propriétés précédées d'une étoile en CSS et pourquoi ont-elles été utilisées ?

Dévoilement des propriétés précédées d'une étoile en CSS

Dans le domaine du CSS, vous avez peut-être rencontré des règles avec des propriétés précédées d'un astérisque ( *). Ce ne sont pas de simples décorations ; ils font partie d'un hack intelligent appelé "star property hack".

L'étoile (*) est un caractère spécial qui marque la propriété comme spécifique à Internet Explorer (IE). Lorsque IE rencontre une telle propriété, il l’interprète différemment des autres navigateurs. Cette technique, souvent utilisée dans le développement Web au tournant du siècle, permettait aux développeurs d'écrire des règles ciblant de manière sélective des navigateurs spécifiques.

Par exemple, considérons l'extrait CSS suivant :

div.with-some-class {
    display:block;                   
    margin:0;
    padding:2px 0 0 0;
    *padding:1px 0 0 0;
    font-size:11px;   
    font-weight:normal;
    *line-height:13px;
    color:#3D9AD0;
}

Notez les propriétés précédées d'un astérisque : padding et line-height. Ces règles sont spécifiquement adaptées à IE. Dans cet exemple, ils définissent des valeurs différentes pour le remplissage et la hauteur de ligne pour IE par rapport aux autres navigateurs, permettant des ajustements spécifiques au navigateur.

Ce hack était particulièrement utile avant l'avènement des préprocesseurs CSS et la prise en charge des navigateurs modernes. . Il constituait un moyen pratique de cibler IE sans avoir à écrire des règles distinctes pour chaque navigateur. Cependant, à mesure que la compatibilité des navigateurs s'est améliorée, le besoin de telles techniques a diminué et elles sont rarement utilisées dans les pratiques de développement modernes.

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!