zoukankan      html  css  js  c++  java
  • 纯CSS实现三列DIV等高布局

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <style type="text/css">
            *
            {
                margin: 0;
                padding: 0;
            }
            #wrap
            {
                overflow: hidden;
                width: 1000px;
                margin: 0 auto;
            }
            #left, #center, #right
            {
                margin-bottom: -10000px;
                padding-bottom: 10000px;
            }
            #left
            {
                float: left;
                width: 250px;
                background: #00FFFF;
            }
            #center
            {
                float: left;
                width: 500px;
                background: #FF0000;
            }
            #right
            {
                float: right;
                width: 250px;
                background: #00FF00;
            }
        </style>
    </head>
    <body>
        <div id="wrap">
            <div id="left">
                <p>
                    left</p>
                <p>
                    left</p>
                <p>
                    left</p>
                <p>
                    left</p>
                <p>
                    left</p>
            </div>
            <div id="center">
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
                <p>
                    center</p>
            </div>
            <div id="right">
                <p>
                    right</p>
                <p>
                    right</p>
                <p>
                    right</p>
            </div>
        </div>
    </body>
    </html>
  • 相关阅读:
    去除字符串中多余空格
    day02-03 字符编码
    eclipse与myeclipse区别
    xz解压和zip解压
    yum安装
    防火墙
    查看和操作HBA卡
    复制linux虚拟机后网卡不能用的解决方法
    关闭IPv6
    更改root密码
  • 原文地址:https://www.cnblogs.com/Yellowshorts/p/3610720.html
Copyright © 2011-2022 走看看