学习完成CSS布局(左右浮动)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>学习完成布局</title>
        <style type="text/css">
            #kaishi{
                width: 980px;      /* width宽度*/
                background: gray;                
            }
            #header{
                height: 200px;      /*height高度*/
                background: red;
            }
            #main{
                height: 600px;
                background: chartreuse;
            }
            #lside{
                width: 700px;
                float: left;          /*浮动左*/
                height: 600px;
                background: blue;
            }
            #rside{
                width: 300px;
                float: right;       /*浮动右*/
                height: 600px;
                background: coral;
            }
            #footer{
                height: 100px;
                background: darkgoldenrod;
            }
        </style>
    </head>
    <body>
        <div id="kaishi">            
            <div id="header"></div>
            <div id="main">    
                <div id="lside"></div>
                <div id="rside "></div>
            </div>
            <div id="footer"></div>
        </div>
    </body>
</html>

一个小菜鸟的笔记！

相关阅读:
iscroll.js & flipsnap.js
IE8’s Substr() Bug
chrome扩展,如何阻止浏览自动关闭桌面通知.
临时邮箱
多个显示器, window.open的定位
页面刷新
PipelineDB Install and Test
CitusDB UPSERT
Kafka部署
ambari-cassandra-service

原文地址：https://www.cnblogs.com/wangchuanyang/p/6277570.html