如何改变盒子的位置?

时间:2014-09-05 12:19:34

标签: html css

这是我的代码,我想在css和html

中创建框

但是当我制作它时,我无法移动盒子,我需要一个从顶部开始的边缘将盒子放在盒子的中心或将它们移动到主盒子中,我该怎么做?

代码:

<html >
    <head>
        <style>
            ui {
                background-color:red;
                padding:100px 100px;
            }

            div1{
                background-color:white;
                padding:50px 50px;
            }

            div2{
                background-color:yellow;
                padding:50px 50px;
            }
        </style>
    </head>

    <body>
        <ui>
            <div1>hello</div1>
            <div2>bye</div2>
        </ui>
    </body>

</html>

1 个答案:

答案 0 :(得分:0)

<!DOCTYPE html>
<html>
<head>
<style>
img {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}
</style>
</head>
<body>

<h1>This is a heading</h1>
<img src="w3css.gif" width="100" height="140">
<p>Because the image has a z-index of -1, it will be placed behind the text.</p>

</body>
</html>

制作:http://www.w3schools.com/css/tryit.asp?filename=trycss_zindex