1

CSS に div があり、境界線のグラデーションを右側にのみ適用したいのですが、それは可能ですか? 他の解決策は、右側に画像を配置するか、境界線に画像を適用することです。すべてのブラウザでサポートされているか、右側の div に画像を配置する必要がありますか? これは私のcssコードです：

#navigation li{
    list-style:none;
}

    #navigation li{
        margin: 0;
        width:126px;
        height:40px;
        padding-left:0px;
        padding-right:0px;
        list-style:none;
        float:left;

        border-color:gradient(start=#fff, end=#000, midpoint=50%);//works? and for other browser?

    }

私のHTML：

<div id="navigation">
            <ul>
                <li><a href="index.php" id="index_btn">HOME</a></li>
                <li><a href="#" id="">AZIENDA</a></li>
                <li><a href="#" id="">PRODOTTI</a></li>
                <li><a href="#" id="">PARTNER</a></li>
                <li><a href="#" id="">NEWS</a></li>
                <li><a href="#" id="">CONTATTI</a></li>
            </ul>
        </div>
4

1 に答える 1

0

WebKit は (少なくとも Chrome 12 では) ボーダー画像としてグラデーションをサポートするようになりました:

-webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;

証明リンク -- http://www.webkit.org/blog/1424/css3-gradients/

注:クロス ブラウザー サポートの画像としてグラデーションの境界線を使用することをお勧めします。

詳細については、この投稿を参照border-imageしてください: http://css-tricks.com/understanding-border-image/

于 2012-07-10T07:42:14.547 に答える