CSS背景重複問題

嗨我似乎無法讓我的背景不重複，甚至得到一個邊界在這裏顯示的是代碼CSS背景重複問題

HTML: 
<div id="content"> 
    <div class="product"> 
    <p><strong>Wonderful Guest House</strong></p> 
    <p><img src="images/knysna.jpg" width="282" height="171" align="absmiddle" /></p> 
    <p>Guest Houses are great alternative accommodation to expensive hotels when   travelling for business or for pleasure. Most guest houses offer &nbsp;the same services as big hotels like cooked meals, airport shuttles, satellite TV, internet connectivity&nbsp; and even conferencing facilities.   </p> 
    <p class="style1">>> <a href="#">Visit Website …. </a></p> 
    </div> 
</div> 


CSS: 
#content{ 
width:90%; 
margin-top: 60px; 
margin-left:5%; 
margin-right:5%; 
background-color:#CCC; 
background-image:url('images/prodblock.jpg') 
background-repeat: no-repeat; 
} 

.product{ 

width:318px; 
display:block; 
float: left; 
}

老實說，我已經試過我可以在網上找到，但不能每哪種方式得到這個工作：/我沒有看到任何衝突在這裏，但我可能會失去一些東西。

這種情況發生在所有的瀏覽器我提前測試

感謝您的輸入。

來源

2013-05-06 anthonytherockjohnson

你缺少在background-image財產的最後一個分號，因此，未來房地產失敗即background-repeat

background-image:url('images/prodblock.jpg'); 
              --^--

來源

2013-05-06 06:33:41

好的我試過了，然後我的背景圖像完全消失了？更新：我移動了圖像標籤，並重復標籤到產品類，它的工作，現在我的問題是讓它來擴展塊的高度？有任何想法嗎？ – anthonytherockjohnson 2013-05-06 07:08:19

@ user2353580從產品中刪除'float：left;' – 2013-05-06 07:10:53

@ user2353580使用'background-size：100％100％;' – 2013-05-06 07:13:07

試試這個：這是因爲浮動屬性。所以我加了清晰的div。你可以用它作爲一個技巧。

<html> 
<head> 
<style type="text/css"> 
#content{ 
    width:90%; 
    margin-top:60px; 
    margin-left:5%; 
    margin-right:5%; 
    background:#ccc url('https://www.google.com/images/srpr/logo4w.png') no-repeat; 
} 
.product{ 
    width:318px; 
    display:block; 
    float: left; 
} 
</style> 
</head> 
<body> 
<div id="content"> 
    <div class="product"> 
    <p><strong>Wonderful Guest House</strong></p> 
    <p><img src="images/knysna.jpg" width="282" height="171" align="absmiddle" /></p> 
    <p>Guest Houses are great alternative accommodation to expensive hotels when travelling for business or for pleasure. Most guest houses offer &nbsp;the same services as big hotels like cooked meals, airport shuttles, satellite TV, internet connectivity&nbsp; and even conferencing facilities.</p> 
    <p class="style1"><a href="#">Visit Website</a></p> 
    </div> 
    <div style="clear:both"></div> 
</div> 
</body> 
</html>

來源

2013-05-06 08:09:44

CSS背景重複問題

回答

相關問題