css div 布局（左右固定，中间自动大小）

最新推荐文章于 2021-05-31 04:18:35 发布

aiman5818

最新推荐文章于 2021-05-31 04:18:35 发布

阅读量139

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/zhangpengshou/archive/2013/04/18/3028643.html

版权

<!DOCTYPE html>
<html lang="zh">
    
    <head>
        <meta charset="utf-8" http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />
        <meta name="viewport" content="width=device-width" />
        <title>布局</title>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <style type="text/css">
            body {
                font-family: Verdana, Arial;
                margin: 0;
                font-size: 12px;
            }
            
            div {
                background-color: #eee;
                border: dotted 1px green;
                text-align:center;
            }

            #dyleft {
                float: left;
                width: 200px;
                height:200px;
                margin-left:20px;
                line-height:200px;
            }
            #dycenter {
                margin: 0 210px;
                height:200px;
                line-height:200px;
            }
            #dyright {
                float: right;
                height:200px;
                line-height:200px;
                width: 200px;
                margin-right:20px;
            }
        </style>
    </head>
    
    <body>
        <div id="mainbody">
            <div id="dyleft">div左栏固定宽度为200px</div>
            <div id="dyright">div右栏固定宽度为200px</div>
            <div id="dycenter">div中间自适应宽度</div>
        </div>
    </body>

</html>

注意：mainbody中的div顺序是左、右、中；颠倒之后害死人阿

转载于:https://www.cnblogs.com/zhangpengshou/archive/2013/04/18/3028643.html

aiman5818

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css div 布局（左右固定，中间自动大小）

<!DOCTYPE html><html lang="zh"> <head> <meta charset="utf-8" http-equiv="X-UA-Compatible" content="IE=EmulateIE9" /> <meta name="view...
复制链接

扫一扫