Question

我要删除子菜单-“查看所有客户端”，“添加新客户端”下的边框。任何帮助将非常感激。附件中的图片具有我要删除边框https://i.stack.imgur.com/GKLgZ.png

的菜单和子菜单

.help-left-menu {
  list-style: none;
  margin-top: 36px;
  padding-left: 18px;
  overflow: auto;
}

.help-left-menu li {
  padding: 5px 8px;
  border-bottom: 1px solid #CCC;
  background: rgba(119, 140, 162, 1);
  text-decoration: none;
}

.help-left-menu li {
  list-style: none;
}

#dropdown-items {
  display: none;
  padding-left: 2px;
}

#dropdown-items a {
  color: white;
}

.menu {
  color: white;
}

.dropdown-list li a.active {
  background: darkslategray;
  border: 1px solid darkgray;
  padding: 10px;
}

.tab-content {
  display: none
}

.config-left {
  margin-top: 36px;
}

.content-heading {
  background-color: rgba(119, 140, 162, 1);
  padding-top: 5px;
  padding-bottom: 1px;
  color: white;
  align-content: center;
  text-align: center;
}

.features {
  padding-top: 4px;
  padding-bottom: 10px;
  color: white;
  padding-left: 0px;
  margin-left: 20px;
}

<ul class="help-left-menu">
  <li class="dropdown-list">
    <div class="features">
      <h5>FEATURES</h5>
    </div>
    <a href="#" data-toggle="dashboard-content" class="dashboard menu 
               tab">DASHBOARD<i class="dropdown-icon"></i></a>
  </li>
  <li class="dropdown-list"><a href="#" data-toggle="new-proposal- 
     content" class="newProposal menu tab">NEW PROPOSAL<i class="dropdown- 
     icon"></i></a></li>

  <li class="dropdown-list"><a href="#" data-toggle="proposal-content" class="proposal menu tab">PROPOSALS<i class="dropdown-icon"></i></a>
  </li>

  <li class="dropdown-list"><a href="#" data-toggle="client- 
           content" class="clients menu">CLIENTS<i class="dropdown-icon"></i>
        
                 <ul class="submenu" id="dropdown-items">
              <li><a href="#" data-toggle="view-all-client-content" 
           class="view-allClients submenu tab">View All Clients</a>
  </li>
  <li><a href="#" data-toggle="add-new-client-content" class="add- 
    newClient submenu tab">Add New Clients</a>
  </li>
</ul>

Answer 1

如果您在CSS选择器中使用了border: none，请确保尝试添加!important或为其添加更高的特异性，以防万一任何事物都具有更高的特异性。

Answer 2

使用类似这样的内容：

.help-left-menu li {
  border-bottom: 1px solid #CCC;
}

.submenu li {
  border: 0;
}

.submenu a {
  font-size: 40px;
  color: red;
  text-decoration: none;
}

<ul class="help-left-menu">
  <li class="dropdown-list">
    <div class="features">
      <h5>FEATURES</h5>
    </div>
    <a href="#" data-toggle="dashboard-content" class="dashboard menu 
               tab">DASHBOARD<i class="dropdown-icon"></i></a>
  </li>
  <li class="dropdown-list"><a href="#" data-toggle="new-proposal- 
     content" class="newProposal menu tab">NEW PROPOSAL<i class="dropdown- 
     icon"></i></a></li>

  <li class="dropdown-list"><a href="#" data-toggle="proposal-content" class="proposal menu tab">PROPOSALS<i class="dropdown-icon"></i></a>
  </li>
  <li class="dropdown-list"><a href="#" data-toggle="client- 
           content" class="clients menu">CLIENTS<i class="dropdown-icon"></i>
        
                 <ul class="submenu" id="dropdown-items">
              <li><a href="#" data-toggle="view-all-client-content" 
           class="view-allClients submenu tab">View All Clients</a>
  </li>
  <li><a href="#" data-toggle="add-new-client-content" class="add- 
    newClient submenu tab">Add New Clients</a>
  </li>
</ul>

如何从菜单列表中删除子菜单边框

2 个答案: