如何在使用多個無序列表時刪除列表項的最後一個子元素的邊框右鍵

Question

我想刪除最後一個子元素邊框 - 右鍵列表元素如下，我試着用不同的類型刪除但它並沒有爲此工作，請幫助我解決這個問題。

<header> 
    <div id="tag" > 
    <ul id="menu-item" class="nav"> 
     <li id="item-1" class="item-type"> <a href="index.html"> Home </a</li> 
     <li id="item-2" class="item-type"> <a href="about.html"> About Me </a></li> 
     <li id="item-3" class="item-type"> <a href="contact.html"> Contact </a> </li> 
     <li id="item-4" class="item-type"> <a href="map.html"> Map </a> </li> 
    </ul> 
</div> 
<div id="head"> 
    <ul id="ul-head"> 
     <li id="head-1" > <a href="/"> <img id="profile" src="Images/display.jpg" alt="profile" width="80px" height="80px" /> </a> </li> 
     <li id="head-2" class="head-item"> TECHNOLOGIES </li> 
     <li id="head-3" class="head-item"> RESUME </li> 
     <li id="head-4" class="head-item"> FUTURE SCOPE </li> 
     <li id="head-5" class="head-item"> INTEREST </li> 
    </ul> 
    </div> 
</header> 

應用CSS如下：

#menu-item { 
    position: absolute; 
    display: block; 
    list-style-type: none; 
    float: right; 
    left: 850px; 
    padding: 9px 10px 9px 10px; 
    text-align: center; 
    margin: 0px 
} 
#menu-item > li { 
    float: left; 
    display: inline; 
    border-left: 1px solid #fff ; 
     padding: 1px 15px 1px 15px; 
    } 
.item-type a { 
     color: #FFFFFF; 
     text-decoration: none; 
    } 

#head #ul-head #head-1 a #profile { 
     position: absolute; 
     border-radius: 50%; 
     display: inline; 
     left: 140px; 
     top: 0px 
    } 

.head-item { 
     position: relative; 
     font-size: 16px; 
     font-family: Arial; 
     font-weight: bold; 
     left: 230px; 
     top: 15px; 
     color: #778899; 
     } 
#ul-head > li { 
      float: left; 
      display: inline; 
      border-right: 1px solid #000000; 
      padding: 1px 25px 1px 25px; 
      text-align: center; 
    } 
#tag #menu-item li:first-child a { 
     border-left: none; 
    } 
#head #ul-head li:last-child a { 
     border-right: none; 
    } 

Answer 1

你不必<a>標籤在＃UL-頭列表

，所以你需要對你的代碼改成這樣：

#head #ul-head li:last-child{ 
     border-right: none; 
    } 

以及列表中的項目＃菜單項的邊框上的L1標籤使用，因此您的CSS代碼應該是這樣的：

#tag #menu-item li:first-child{ 
     border-left: none; 
    }