Question

我正在尝试将PNG直接堆叠在另一个PNG之上。第一个PNG（logo2）旨在直接位于第二个PNG（form2）的顶部 - 两者都是居中的。我已经调整并搞砸了所有东西，我似乎仍然忽略了一些能让我得到我所需要的东西。我的代码是这样的：

  html{
     background: url(images/bg4.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
     background-size: cover;
     }

  #main{
     background: url(images/logo2.png) 0 0 no-repeat;
     margin: 8% auto 0 auto;
     padding: 138px 71px 0 142px;
     width: 1014;
     height: 228px;
     position: relative;
    }


  #main form {
      margin: 13% auto 0 auto;
      width: 806px;
      height: 262px;
      background: url(images/form2.png) 0 0 no-repeat;
      position: relative;
    }

我不会将我的表格包裹在主页上，或者是我的保证金/填充中的错误会更为谨慎吗？

谢谢！

Answer 1

这个jsFiddle会告诉你如何：

http://jsfiddle.net/NLb2J/

使用绝对位置和z-index

以基本HTML页面为中心堆叠CSS

1 个答案: