div內的全角背景

Question

所以我有：

<div class="wrapper">

    <div class="full-width">
        <div class="header">
            <a href="">
                <img src="img/logo.png" alt="Logo" class="logo img-responsive" />
            </a>
            <nav>
                <ul class="nav nav-pills">
                    <li><a href="">Moden Web Design</a></li>
                    <li><a href="">Prices</a></li>
                    <li><a href="">Demonstration</a></li>
                    <li><a href="">Contact Us</a></li>
                </ul>
            </nav>
        </div>
    </div>
</div>

在<div class="wrapper"> ，其width:1100px; 。 所以問題是我是否可以使div class="full-width"具有全角背景...因為它停在.wrapper的空白處。

我嘗試了這種方法，但是不起作用：

.full-width {
    height:50px;
    position:absolute;
    width:100%;
    z-index:100;
}

Answer 1

我不知道您的整個代碼，但這是一個小提琴

.full-width {
  background: #333;
  height: 50px;
  position: absolute;
  left: 0;
  margin-top: 100px;
  width: 100%;
  z-index: 100;
}

Answer 2

也許您可以添加left:0px; 然后再試一次。 您也可以嘗試使用負邊距或寬度超過100％。 希望對您有所幫助；）

Answer 3

您可以使用設置背景大小

background-size {
 Xpx Ypx;
}

或者您可以嘗試為全角容器提供背景。

Answer 4

將您的CSS設置為max-width:100%; max-height:100%; max-width:100%; max-height:100%;

另外，請閱讀http://unstoppablerobotninja.com/entry/fluid-images