1

現在、ヘッダー セクションの背景に配置したいバナーを使用しています。私が抱えている問題は、画像が繰り返されていることです。属性no-repeatを使用してみましたが、結果として何も表示されません。#header画像はdivの背景として設定されています。繰り返さずに画像を表示するにはどうすればよいですか?

CSS

<style>
#header {
    height:165px;
    border-top:15px solid #000;
    background-image:  url(http://webprolearner2346.zxq.net/css-test2/images/banner1.png);
}
</stle>

HTML

<div id="header">
      <div class="search"><input type="text" class="search-input" name="search" value="Search" onclick="$(this).val('');" /><input type="submit" class="search-submit" /></div>
      <div id="navigation">

       <ul class="button-list">
       <h2>MAIN TITLE PAGE</h2>
        <li><a href="#" class="buttonNav" >Content 1</a></li>
        <li><a href="#" class="buttonNav" >Content 2</a></li>
        <li><a href="#" class="buttonNav" >Content 3</a></li>
        <li><a href="#" class="buttonNav" >Content 4</a></li>
        <li><a href="#" class="buttonNav" >Content 5</a></li>   
       </ul> 
      </div>
     </div>
4

3 に答える 3

3
#header {
    height:165px;
    border-top:15px solid #000;
    background-image: url('http://webprolearner2346.zxq.net/css-test2/images/banner1.png');
    background-repeat: no-repeat;
}

証明: http://awesomescreenshot.com/029cplk1d

しかし、次のようにすることもできます。

background: url('http://webprolearner2346.zxq.net/css-test2/images/banner1.png') no-repeat;
于 2012-08-09T10:13:11.473 に答える
0

あなたはこれを通してあなたの望む結果を得ることができます:-

#header {
        background-image: url("http://webprolearner2346.zxq.net/css-test2/images/banner1.png");
        background-repeat: no-repeat;
        border-top: 15px solid #000000;
        height: 165px;
    }
于 2012-08-09T10:15:25.590 に答える
0

これも試してみてください。

<style>
#header {
    height:165px;
    border-top:15px solid #000;
    background:url(http://webprolearner2346.zxq.net/css-test2/images/banner1.png) no-repeat;
}
</style>
于 2012-08-09T10:27:04.040 に答える