css样式学习6

来源：互联网发布：java redis 连接池编辑：程序博客网时间：2024/05/16 01:25

相对定位

采用相对定位的元素，会相对于他原来的位置进行定位， 并且元素原始占用位置不会被其他元素占用

以下是代码实现：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <style>        #left,#center,#right{            float: left;        }        #left{                     width: 200px;                     height: 200px;                     background-color: red;                 }        #center{            width: 200px;            height: 200px;            background-color: yellow;            position: relative;            top: 30px;            left: 30px；            z-index: -1;        }        #right{            width: 200px;            height: 200px;            background-color: blue;        }    </style>    <title>相对定位</title></head><body><div>    <div id="left"></div>    <div id="center"></div>    <div id="right"></div></div></body></html>

阅读全文

0 0