Combinez CLASS pour compléter le style de mise en page Web_CSS/HTML

C'est ainsi que je crée le code de mise en page DIV. Je ne sais pas si c'est clair ou pas, regardons ensemble
Mon idée est qu'à l'avenir : Utiliser des pièces standards pour assembler la mise en page DIV de la page web

I diviser les classes en 2 types, la classe de mise en page, la classe de style, la classe de mise en page est le squelette, la classe de style est les vêtements
Par exemple :
Par exemple, la colonne de gauche dans la mise en page
Tout d'abord, ses attributs sont : la colonne de gauche, la largeur, la couleur d'arrière-plan, la couleur de la police, etc.

1. Tout d'abord, une classe sera définie, telle que : .layout, qui sert principalement à contrôler la taille entière de la page
.layout{width:98%;margin:0 auto;text-align:left;}

2. Puis 3 mises en page de base Class(l,m,r)
.l{float:left}
.m{width:auto}
.r{float:right}
Je mets Le 2- La disposition en colonnes est également classée comme disposition à 3 colonnes, car dans la disposition à 3 colonnes, lorsque la largeur des colonnes de gauche et de droite est respectivement de 0, 3 colonnes deviennent 2 colonnes.
Lorsque nous écrivons le code de mise en page de base, il est préférable de l'écrire dans un format à 3 colonnes.

３． Correspondant à la classe de mise en page, définissez la classe de style requise, telle que la largeur, la hauteur, la couleur d'arrière-plan, etc. Ce sont tous des éléments de style
.class_l{background:#ff0;margin-right: -150px;width:150px; >
.class_m{background:#f00;margin:0 140px 0 150px;}
.class_r{background:#00f;margin-left: -140px;width:140px;}

Là n'est qu'un ensemble de classes de mise en page , de nombreuses classes de style peuvent être définies.
Par exemple, si vous souhaitez créer une petite mise en page à deux colonnes dans la colonne du milieu
, vous pouvez définir une autre classe de style
. mid_l{background:#ff0;margin-right: - 100px;width:100px;}
.mid_m{background:#f00;margin:0 0 0 100px;}

4. et la classe de style, et référencez-la dans le code comme ceci