zoukankan      html  css  js  c++  java
  • 三栏的网页布局,中间宽度自适应

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <link  href="style.css" rel="stylesheet" />
      <style type="text/css">
                            #box
                            {
                                    /*高度必须设置,否则IE下子元素的absolute定位异常。且此处应设置为100%,因为内容部分的高度不确定。*/
                                    height:100%;
                                    position:relative;
                                    
                            }
                            #middle
                            {
                                    height:100px;
                                    margin:0 200px;
                                    background-color:red;
                            }
                            #left
                            {
                                    height:100px;
                                    200px;
                                    position:absolute;
                                    top:0px;
                                    left:0px;
                                    background-color:green;
                            }
                            #right
                            {
                                    height:100px;
                                    200px;
                                    position:absolute;
                                    top:0px;
                                    right:0px;
                                    background-color:blue;
                            }
                    </style>
    </head>
    <body>
      <div id="box">
                            <!--优先加载中间部分,后加载两侧-->
                            <div id="middle"></div>
                            <div id="left"></div>
                            <div id="right"></div>
                    </div>
    </body>
    </html>
  • 相关阅读:
    北京之行
    csharp进界
    医院OA系统新思考
    茗洋博客
    monkey主要参数详解
    使用python判断Android自动化的渠道包是否全部打完
    手机连接mac电脑无法使用adb命令解决方法
    Python正则表达式指南
    Mac基本命令大全
    Mac之vim普通命令使用
  • 原文地址:https://www.cnblogs.com/xiaoleidiv/p/3732061.html
Copyright © 2011-2022 走看看