css设的高度或宽度一样,也在一个大div盒子里面,但是就是位置不一样?

html-css06

css设的高度或宽度一样,也在一个大div盒子里面,但是就是位置不一样?,第1张

首先确保这个div是不是是block。默认情况下,div是block。可能在设置某些css样式的时候更改了也不一定。 可以如果设置了高度,他的高度就会固定下来。可以这样改。不设置他的高度,设置它的overflow:hidden属性就可以自适应内容了、

<body>

    <div style="height: 30% width: 100% background-color: yellowposition: relative">

        <div style="background-color: red width: 30%padding-top: 30%height: 0">

            <b style="color: blackfont-size: 34px">通过padding实现的正方形</b></div>

        <div style="position: absoluteright:0top:0background-color: pinkwidth: 50%height: 100%">

            <div style="background-color: blue height: 25vw width: 50%">

                <b style="color: whitefont-size: 34px">通过vw,vh实现的正方形</b></div>

        </div>

    </div></body>

1.根据padding属性实现正方形。

图中的左侧就是通过padding实现的正方形

padding的属性可能的值有四种类型:

用JQ来设置高度,你可以参考这个有点类似http://zhidao.baidu.com/link?url=w0xGkp-Jf7ghcNcp8jR2GOkMxqIqWaV2q8y0XOida4AcC80fCVsMQ-YGwuW8krn4SUulHjc5bh4ZC5-gYE4wvK