Question

所以，我必须让我的网站像这样（这是一个大学的项目）： Site goal 但我得到的只是：一世。堆。 imgur。 COM / wN1TZ.png

我无法将图像放在另一个图像上并居中，我已经尝试了位置：相对，边距：自动和宽度：65％似乎没有效果。

 <div class="menu">
    <ul>
        <li><a href="index.html">HOME</a></li>
        <li><a href="apresentacao.html">APRESENTAÇÃO</a></li>
        <li><a href="programacao.html">PROGRAMAÇÃO</a></li>
        <li><a href="inscricao.html">INSCRIÇÃO</a></li>
        <li><a href="comite.html">COMITÊ</a></li>
        <li><a href="apoio.html">APOIO</a></li>
    </ul>
</div>
<div id="menu_princ">
    <div class="banner_fundo">
        <img src="banner.jpg">
    </div>
    <div class="enter-down-bounce">
        <img src="logogd.png" class="logogd">
        <article class="tudo2">
        <h1>GameDays 2015</h1>
    <h4><p>21 a 23 de Outubro</br>
    no campus Liberdade da Universidade Cruzeiro do Sul</p></h4>
<br></br>
</article>
<a role="button" target="_blank">Faça sua Inscrição</a>

        </div>

</div>

和css：

@import url(https://fonts.googleapis.com/css?family=Fira+Sans); body{ font-family: 'Fira-Sans', sans-serif; color: #000000; } .logo{ padding: 0 0; float: left; } .banner_fundo{ max-width: 100%; position: relative; } ul li{ list-style: none; display: block; } .menu{ padding: 0; margin-right: 30px; float:right; width:100%; } .menu li{ display:inline-block; padding:0; margin:15px; -webkit-justify-content: space-around; justify-content: space-around; } .logogd{ margin: auto; position: relative; } .menu ul a:hover{ background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(4, 29, 61, 1)), color-stop(100%,rgba(2, 3, 27, 1))); } .menu a:link, .menu a:visited{ text-decoration: none; color: #000000; } .tudo2{ text-align: center; }

Answer 1

将元素（B）放在另一个元素（A）之上：

1。）将B 放在 A中，使其从位置

开始

2.。）将display: absolute;分配给B，将display: relative;分配给A

3.。）使用top或bottom以及left或right参数调整B的位置。给它一个宽度和高度设置或全部四个顶部，底部，左侧和右侧设置（定义外部限制，所以说）。

在您的情况下，A和B可能是DIV banner_fundo和enter-down-bounce，它们是您代码中唯一包含图像的内容。

图像在另一个CSS之上

1 个答案: