Combine class to complete the webpage layout style

I am doing this for div Layout Code I don't know. I don't know. Let's take a look.
My idea is that in the future, we can use standard parts to assemble the webpage Div layout.

I divide the class into two types: Layout class, Style Class, layout class is skeleton, style class is clothes
For example:
For example, the left column in the layout
First, its attributes include: left column, width, background color, font color, etc.

1. First, a class, such as. layout, is defined to control the entire page size.
. Layout {width: 98%; margin: 0 auto; text-align: Left ;}

2. Three basic layout classes (L, M, R) will be defined)
. L {float: Left}
. M {width: auto}
. R {float: right}
I also classify the two-column layout in the three-column layout, because in the three-column layout, when the width of the left and right columns is 0, the three columns are changed to two columns.
When writing the basic layout code, we 'd better write it in 3 column format.

3. Define the required style class, such as width, height, and background color, corresponding to the layout class.
. 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 ;}

The layout class has only one set, and the style class can be defined a lot.
For example, you need to make a small 2-column layout in the middle column.
You can define another style class.
. Mid_l {Background: # ff0; margin-Right:-100px; width: 100px ;}
. Mid_m {Background: # f00; margin: 0 0 0 100px ;}

4. Combine the layout class and style class to reference the layout class in the code.
<Div class = "l class_l"> </div>
<Div class = "l mid_l"> </div>
The two classes are referenced and separated by spaces in the middle. The layout class is in the front, the style class is in the back, and the Space reference can be continued in the back. If special definitions are required, you can define this Div with an ID.

Some other commonly used style classes can also be written as generic, for example, implicitly can be defined
. Hide {display: None}
When necessary, class = "XXX hide" is very convenient.Xmlns = "http://www.w3.org/1999/xhtml">
Left

Herethere

Right

Middlehere1there1