1 
<div id="header"><!--start #header-->
    <img id="logo" height="80" src="../resources/CHUG-LOGO.png" />
    <ul>
        <a href="../home" title="Home"><li id="home"><h2>Home</h2></li></a>
        <a href="../about" title="About"><li id="about"><h2>About</h2></li></a>
        <a href="../store" title="Store"><li id="store"><h2>Store</h2></li></a>
        <a href="../contact" title="Contact"><li id="contact"><h2>Contact</h2></li></a>
    </ul>                    
</div><!--end #header-->

#header ul {
    padding: 0px;
    list-style-type: none;
    margin: 0px;
    float: right;
}
#header ul li {
    text-align: center;
    display: block;
    margin: 0px;
    float: left;
    padding-top: 45px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    height: 65px;
    border-left: 1px solid #755b2c;
    border-right: 1px solid #b99e68;
}
#header ul li h2 {
    min-width: 105px;
    margin: 0px;
    padding: 0px;
    display: inline-block;
    color: #000;
    font-size: 20px;
    font-weight: bold;
}

これは私のナビゲーション バー用のコードで、最後のリスト項目の右側の境界線を削除しようとしています。疑似識別子 :last-child を使用する必要があることはわかっていますが、それを機能させることができないようです。何か案は？

4

2 に答える 2

2

lis は要素ulによってラップされているため、技術的には要素の子ではありませんa。aを の内側に移動しli、同じコードを再度使用します。

于 2012-12-17T01:10:57.123 に答える
0 
#header ul a:last-child li {
  border-right: none
}

ただし、last:child は IE6、IE7、および IE8 では機能しないことを忘れないでください: http://quirksmode.org/css/contents.html

于 2012-12-17T01:23:24.530 に答える