從引導列表中刪除單個項目符號圖標

我有一個Bootstrap列表組，其中包含圖標項目。我試圖從列表組中刪除第一個圖標。我怎樣才能做到這一點？這裏是我的代碼：從引導列表中刪除單個項目符號圖標

<ul class="list-group" id="vacationList"> 
       <li class="list-group-item text-center" id="vacationListTitle">Our in-home pet care includes the following care treatment:</li> 
       <li class="list-group-item">All the love, attention, kissing and scracthing your pet deserves</li> 
       <li class="list-group-item">Walk, exercise, playtime or visit</li> 
       <li class="list-group-item">Food, treats and fresh water as needed</li> 
       <li class="list-group-item">Trash and pet waste removal</li> 
       <li class="list-group-item">The administration of medicine</li> 
       <li class="list-group-item">Gathering of of all mail</li> 
       <li class="list-group-item">Watering of all plants and garden</li> 
       <li class="list-group-item">Report card including the time of the visit and details of the pet care experience</li> 
       <li class="list-group-item">In additional we are prepared to accomodate any other unlisted and reasonable needs</li> 
       <li class="list-group-item">$65 includes overnight stay from 8:00 pm until 7:00 am and 1 late afternoon visit. Includes care for 2 pets ($3 per additional pet)</li> 
      </ul>

#vacationListTitle { 
    background-color:map-get($colorMap, orangeColor) !important; 
    font-family:$headerFont; 
    font-size:1.3em; 
    content:none !important; 
    padding-left:0px !important; 
} 

#vacationList { 
    margin:0 auto; 
    border-radius:5px; 

    li { 
    padding-left:30px; 
    } 

    li:nth-child(odd) { 
    background-color:#e5e5e5; 
    } 

    li:before { 
    /*Using a Bootstrap glyphicon as the bullet point*/ 
    content: "\e080"; 
    font-family: 'Glyphicons Halflings'; 
    font-size: 9px; 
    float: left; 
    margin-top: 4px; 
    margin-left: -21px; 
    color: #555; 
    } 
}

與類名vacationListTitle列表項是一個我想刪除的圖標。有什麼想法嗎？

謝謝！

來源

2017-04-13 Brixsta

'#vacationListTitle：前{顯示：無; ''？ –

謝謝你，先生。 – Brixsta

您可以用display屬性做到這一點，特別是靶向的::before僞元素：

#vacationListTitle::before { 
    display: none; 
}

來源

2017-04-13 08:56:02

該標記使該列表項消失。我只是想讓圖標消失。 – Brixsta

@Brixsta啊對不起，我錯過了你的部分問題。我修改了我的答案。 –

謝謝你好先生 – Brixsta

可以的vacationList

#vacationList { 
    ..... 
    ..... 
    ..... 
    li:first-of-type:before { 
     content: ""; 
    } 
}

李之前刪除第一的內容或者您可以使用編號#vacationListTitle直接

#vacationListTitle:before { 
     content: ""; 
    }

See demo here

來源

2017-04-13 09:02:36 Chiller

這不起作用，因爲它比在OP的例子中增加圖標的選擇器具有更低的特異性。 –

他正在使用sass，因此他必須將其添加到#vacationList {....} – Chiller

從引導列表中刪除單個項目符號圖標

回答

相關問題