Comment réinitialiser les styles en CSS ? Implémentation de l'effet de réinitialisation du style CSS (exemple de code)

Cet article vous présentera comment réinitialiser l'effet à l'aide des styles CSS. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Lorsque nous nous préparons à développer un projet, nous devons considérer la compatibilité de certains navigateurs, ou il est plus pratique d'écrire une page par nous-mêmes. Alors beaucoup de gens penseront à la réinitialisation CSS à ce moment-là, et la plupart. les gens feront ça.

@charset "utf-8";
/* 使用重置样式表 */

html, body, p, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym,
address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, 
var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;    
}
body{
    line-height:1;
}
ol,ul{
    list-style:none;
}
blockquote, q{
    quotes:none;
}
blockquote:before, blockquote:after, q:before, q:after{
    content: '';
    content:none;
}
/* remeber to define focus styles! */
:focus{
    outline:0;
}
/* remeber to highlight inserts somehow */
ins{
    text-decoration:none;
}
del{
    text-decoration:line-through;
}

/* tables still need 'cellspacing="0" in the markup' */
table{
    border-collapse:collapse;
    border-spacing:0;
}

Notez que vous ne pouvez pas écrire comme ceci sur certains sites : *{margin:0;padding:0;} Cela gaspillera beaucoup de performances

Mais ce n'est qu'un des éléments suivants. ce qui précède En termes de balises de pile, nous en avons également beaucoup inutilisées, et certaines inutiles. Dans certains cas, utilisez simplement celles-ci

body, dl, dd, h1, h2, h3, h4, h5, h6, p, form{margin:0;} 

ol,ul{margin:0; padding:0;}

D'accord, c'est tout pour la réinitialisation !

Résumé : Ce qui précède représente l’intégralité du contenu de cet article, j’espère qu’il sera utile à l’étude de chacun. Pour plus de didacticiels connexes, veuillez visiter le Tutoriel vidéo CSS  !

Recommandations associées :

Tutoriel vidéo de formation sur le bien-être public php

Manuel en ligne CSS

Tutoriel graphique div/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!