Maison > Article > interface Web > Comprendre les mots-clés initial, hériter, unset, revert et tous les attributs en CSS
En CSS, il existe 4 mots-clés qui peuvent théoriquement s'appliquer à n'importe quelle propriété CSS, ils sont initial (initial), Heherit (hérité), unset (non défini), revert (réduction ). La valeur de tout ne peut être que les quatre mots-clés ci-dessus. Cet article présentera initial, hériter, supprimer, revenir et tout.
représente la valeur initiale par défaut de l'attribut de l'élément (la valeur par défaut est définie par la spécification CSS officielle)
Compatibilité : IE le fait ne prend pas en charge
[Note] Les valeurs par défaut initiales de chaque attribut sont déplacées ici
//display在官方CSS规范中定义的默认值是inline <style> .test{display: initial;} </style> <div class="box"> <div class="test">测试一</div><span>文字</span> <br> <div >测试二</div><span>文字</span> </div>
signifie La valeur calculée de l'attribut correspondant de l'élément parent direct de l'élément
Compatibilité : IE7-non pris en charge
<style> .box{ border: 1px solid black; padding: 10px; width: 100px; } .test{ border: inherit; height: 30px; } </style> <div class="box"> <div class="test">测试一</div> </div> <div class="box"> <div class="in"> <div class="test">测试二</div> </div> </div>
unset est relativement plus compliqué qu'initial etherit. Indique que si la propriété est héritable par défaut, la valeur est héritée ; sinon, la valeur est initiale ; En fait, définir unset équivaut à ne pas définir
Compatibilité : IE ne le prend pas en charge, safari9- ne le prend pas en charge, ios9.2- ne le prend pas en charge, android4.4.4- ne le prend pas en charge
【La valeur par défaut couramment utilisée est OK Styles hérités]
color cursor direction font letter-spacing line-height list-style text-align text-indent text-shadow text-transform white-space word-break word-spacing word-wrap writing-moderrree
représente la valeur par défaut de l'attribut d'élément défini dans la feuille de style. S'il est explicitement défini dans la feuille de style définie par l'utilisateur, suivez ce paramètre ; sinon, suivez le paramètre de style dans la feuille de style définie par le navigateur, sinon cela équivaut à unset
Compatibilité : uniquement safari9.1+ et ios9 .3+ prend en charge
moyens de réinitialiser les valeurs d'attribut de tous les attributs CSS à l'exception d'unicode-bidi et de direction. Les valeurs ne peuvent être. initial et hériter. , annuler et revenir
Compatibilité : IE non pris en charge, safari9-non pris en charge, ios9.2-non pris en charge, android4.4-non pris en charge
//内容为测试一的元素和内容为测试二的元素的样式是一样的 <style> .box{ border: 1px solid black; padding: 10px; width: 100px; color: red; } .test1{ border: unset; color: unset; } </style> <div class="box"> <div class="test">测试一</div> <div>测试二</div> </div>
【1】Quand tout : initial , tous les attributs de .in prennent la valeur par défaut
<style> .test{ border: 1px solid black; padding: 20px; color: red; } .in{ /* all: initial; all: inherit; all: unset; all: revert; */ } </style> <div class="test"> <div class="in">测试文字</div> </div>
【2】Quand all:inherit, tous les attributs de .in prennent la valeur héritée de l'élément parent
border:none;padding:0;color:black;
【3】 Quand tout : Lorsqu'elles ne sont pas définies, toutes les propriétés de .in équivalent à ne pas définir de valeur. L'héritage par défaut est hérité et les propriétés non héritables conservent la valeur par défaut
border:1px solid black;padding:20px;color:red;
Cet article Réimprimé de : https://www.cnblogs.com/xiaohuochai/p/5464456.htmlApprentissage recommandé :
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!