인라인 블록 및 목록 스타일 이미지가있는 CSS 문제

Question

display: inline-block을 목록 요소에 적용하면 list-style-image가 나타나지 않는 이유는 무엇입니까?

Answer 1

목록 항목의 가장 중요한 스타일 속성은 display의 기본값이 list-item입니다. 이 설정은 요소가 각각 list-style과 함께 표시되는 이유입니다. display에서 inline-block으로 설정하면 목록 항목에 대한 유일한 항목이 제거되어 목록 항목이됩니다.

Answer 2

인라인 블록을 사용하여 목록 요소를 원하지만 여전히 총알을 보여 주면, 당신이 사용할 수있는 :: 의사 요소와 내용 재산 이전 :

li { 
display: inline-block; 
} 
li::before { 
content: '\25cf\a0'; 
} 

(\ 25cf가 유니 코드가 가득 원 기호 \ a0는 비 분리 공간입니다).

Answer 3

float : left; 최소 너비와 최소 높이를 추가하십시오.

.footer ul li{ 
    float: left; 
    list-style-image: url(../images/arrow.png); 
    margin: 0px 0px 10px 0px; 
    box-sizing: border-box; 
    min-height: 38px; 
    min-width: 300px; 
}