html – 绝对div内的中心div_html-js-css

概述看到这个链接……： Exemple 在这个网站上我有这个代码 <body> <div id="geral"> <div id="animacao"> <ul id="banners"> <li><img src="banners/banner_1.jpg" alt="Banner 1" /></li> 看到这个链接……： Exemple

在这个网站上我有这个代码

<body>    <div ID="geral">        <div ID="animacao">            <ul ID="banners">                 <li><img src="banners/banner_1.jpg" alt="Banner 1" /></li>                <li><img src="banners/banner_2.jpg" alt="Banner 2" /></li>            </ul>        </div>        <div ID="menu">        </div>                  </div></body>

#geral位于屏幕中央 –

#animacao具有相同大小的#geral,其上有动画图像和淡入淡出效果.

#menu有271px,需要留在#geral和#animacao的中心,在此我将把菜单与PNG bakcground ….

这是我的CSS,可能不起作用……

#geral{    position: absolute;    wIDth:990px;    height:530px;    top:50%;    left:50%;    margin-top:-265px;    margin-left:-495px;    background: url(../imagens/fundo.jpg) no-repeat;}#animacao{    position: relative;    wIDth:990px;    height:530px;}#menu{    position: absolute;    left: 50%;    wIDth:271px;    height:530px;    margin-left:-135px;    background-color:yellow;    z-index: 10;}

我哪里错了？

Demo

解决方法这是你想要做的吗？ http://jsfiddle.net/brettdewoody/C4jSS/

或者您是否希望#menu div位于#animacao之上？

HTML

<div ID="geral">    <div ID="animacao">        <div ID="menu">        <div>    </div>       </div>

CSS

#geral{    position: absolute;    wIDth:990px;    height:530px;    top:50%;    left:50%;    margin-top:-265px;    margin-left:-495px;    background-color: black;}#animacao{    position: relative;    wIDth:990px;    height:530px;    background-color: red;}#menu{    position: relative;    margin:0 auto;    wIDth:271px;    height:530px;    background-color:yellow;    z-index: 10;}

总结

以上是内存溢出为你收集整理的html – 绝对div内的中心div全部内容，希望文章能够帮你解决html – 绝对div内的中心div所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1069728.html