0

背景色に対して少し暗い色合いのナビゲーションバーがあります。ナビゲーションバーの右端と左端のビットが背景色に達するように、中央から左右の両方にグラデーションが必要です。これは可能ですか？

<body>
<div id="container">
    <div id="header">
        <h1>
            <!--<a href="#"><img src="tracylogo7.jpg" alt="Millington and Hope" /></a> -->
            <a href="#"><img src="tracylogo5_header.jpg" alt="Millington and Hope" /></a>
        </h1>
        <h2>
            <!--<a href="#"><img src="tracylogo5_header.jpg" alt="Millington and Hope" /></a> -->
        </h2>   
    </div>
    <ul id="nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="stock.html">Stock</a></li>
        <li><a href="events.html">Events</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
    <div id="box">
            <a href="#"><img src="home1.jpg" alt="Slideshow Image 1" /></a>

            <a href="#"><img src="home3.jpg" alt="Slideshow Image 2" /></a>

            <a href="#"><img src="home2.jpg" alt="Slideshow Image 3" /></a>
    </div>
    <div id="footer">
        <p class="client">Tel: 0788740&nbsp;&nbsp;&nbsp;&nbsp;E-mail: tjdelane@hotmail.co.uk</p>

    </div>
</div>      
</body>


#nav
{
  border:1px solid #ccc;
  border-width:1px 0;
  list-style:none;
  margin:0;
  padding:0;
  text-align:center; 
  background:rgb(161,153,134)
  background: #999; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='(#A19986', endColorstr='#ABA390'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#A19986), to(#ABA390)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #ccc,  #000); /* for firefox 3.6+ */ 
}
4

1 に答える 1

2

はい。CSS は、さまざまな程度のクロス ブラウザーの成功 (線形、放射状、およびカラー ストップを含む) でグラデーションを実行できます。このジェネレーターを試して何かを構築してください: http://www.colorzilla.com/gradient-editor/

于 2012-07-24T02:32:54.953 に答える