CSS:网页混合布局,浮动,绝对定位,相对定位

来源:互联网 发布:做网络推广怎么找客户 编辑:程序博客网 时间:2024/05/17 02:09

float
position: relative
position: absolute;left: 130px;top: 0;
实例

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title>练习布局</title>    <style type="text/css">        div{margin: 0 auto;}        .top{width:600px;height: 100px;background-color:aquamarine ;}        .main{width: 600px;height: 500px;background-color: red;position: relative;}        .left{width: 20%;height: 500px;background-color: navy;float: left;}        .right{height:500px;background-color: greenyellow;position: absolute;left: 130px;top: 0;}        .foot{width:600px;height:100px;background-color: brown;}    </style>    </head>    <body>        <div class="top">top</div>        <div class="main">            <div class="left">left</div>            <div class="right">right            引入缓冲技术的最主要目的是为了解决 CPU 与外设之间的速度不匹配问题,这样的说法正确吗?            </div>        </div>        <div class="foot">foot</div>    </body></html>
原创粉丝点击