2017-04-13 2 views
0

아이콘이있는 글 머리표 목록이있는 부트 스트랩 목록 그룹이 있습니다. 목록 그룹에서 첫 번째 아이콘을 제거하려고합니다. 어떻게해야합니까?부트 스트랩 목록에서 단일 글 머리 기호 아이콘 제거

<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와 목록 항목이 난에서 아이콘을 삭제할 하나입니다 : 여기 내 코드입니다. 이견있는 사람?

감사합니다.

+1

'#vacationListTitle : {전에 디스플레이 : 없음; }'? –

+0

고맙습니다. – Brixsta

답변

1

당신은 특히 ::before 의사 요소를 표적으로의 display 속성을 사용하여이 작업을 수행 할 수 있습니다

#vacationListTitle::before { 
    display: none; 
} 
+0

이 마크 업은 해당 목록 항목을 사라지게합니다. 나는 아이콘을 사라지 길 원해. – Brixsta

+0

@Brixsta ah 죄송합니다. 질문에 그 부분이 빠졌습니다. 내 대답을 수정했습니다. –

+0

고마워요 선생님 – Brixsta

1

당신은 vacationList

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

의 리튬 전에 첫 번째의 내용을 제거 할 수 있습니다 또는 ID를 사용할 수 있습니다 #vacationList 제목 바로

,515,
#vacationListTitle:before { 
     content: ""; 
    } 

See demo here

+0

OP의 예에서 아이콘을 추가하는 선택기보다 특이성이 낮기 때문에이 기능이 작동하지 않습니다. –

+0

그는 sass를 사용하기 때문에 #vacationList {...} 안에 추가해야합니다. – Chiller

관련 문제