当前位置:编程学习 > html/css >>

html网页设计,怎么使用div+css实现这样的效果:

现有三个div,姑且称之为div1、div2、div3,其中div2、div3存在于div1中,div1的高度是随内容变化而变化的,如何让div2、div3的背景图片的高度和div1一样自适应变化,最终的目的是使div1、div2、div3高度一样高。。。
追问:这样说吧,div1是一个主体,div2、div3分别是两张图片,让他们在垂直方向平铺,并让div2、div3附着于div1这个主体上面。然后div2、div3的css里面分别有left:-100px ;right:-100px ;这样说更好理解。。。那个解决了,现在有一个新问题:只引用一张图片,上中下三部分,截取(background-position:******)中间一部分让它垂直方向重复出现,这个怎么实现?div2、div3我设置成height:100%;,ie浏览器不行,其他还好的,如果做一个图太大了。。。   你能不能帮我写个js  我在网上找了一些,不起作用。。。。等待中。。。。。
答案:DIV本身就是自适应高度的.你只要把背景图片做到足够内容放上去后.背景能正常显示就可以的啊.
其他:1、纯css是做不到的。得用js读取div1的高度,然后设置div2和div3 的高度,才可以做到。
2可以不用div2和div3,吧div2和div3设置成一个背景图,既然都是垂直平铺做成一个图就是了,分开做没啥意义啊,将这个背景图直接设置在div1的背景上不就行了。为什么一定要分开。 div2和div3都在div1中占据空间,div1包含他们,div1能和他们一样高? 简单,看好了
css样式
div1{
      padding:0;margin:0;
      }
div2{
       width:50%;height:100%;
       padding:0;margin:0;
       position:relative;
       float:right;}
img{
       position:absolute;left:0;top:0;z-index:-10;
       width:100%;height:100%;}
div3{
       width:50%;height:100%;
       padding:0;margin:0;
        position:relative;
       float:left;}
div4{
        clear:both;}
<div id="div1">
        <div id="div2"><img src=""/>内容</div>
        <div id="div3"><img src=""/>内容</div>
        <div id="div4"></div>
</div>
div4的作用就是让div1变大,自动变化。
有问题QQ1039778008,还有上面只是我写得一些想法,具体情况还要看你的文本。欢迎任何对css+div有问题的人来找我。 

上一个:我想知道在div+css中到底应该怎样做图片上下滚动的效果啊?我快我疯掉了。具体一点!我自己看不懂啊!
下一个:淘宝可以用JS代码和CSS链样式吗?

CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,