css layout

I think it is necessary to summarize the css layout~~~~

1. Left fixed, right adaptive

css :float+margin

<head>
        <meta charset="utf-8">
        <style>
            *{
                margin:0;
                padding:0;
            }
            .left{
                width:200px;
                height:300px;
                background-color:red;
                float:left;
            }
            .right{
                margin-right: 300px;
                height:300px;
                width:100%;
                background-color:yellow;
            }
        </style>
    </head>
    <body>
        <!-- Two-column layout -->
        <!-- Fixed width on the left, adaptive on the right-->
        <div class="left"></div>
        <div class="right"></div>
    </body>

Here is the effect:

 

2.

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324576483&siteId=291194637