list-style-type: none; 리스트 앞에 붙은 점을 제거 하기 위해서
본문
list-style-type: none;
리스트 앞에 붙은 점을 제거 하기 위해서
list-style-type의 값을 'none'으로 설정하였습니다.
list-style-type 대신 list-style 속성을 사용했습니다.
목록
첫번째 점 만 게거 - 사과
점 - 바나나
점 - 오렌지
첫 번째 점 만 안나오고
두 번째 부터 ~ 나오게 하려면 어떻게 해야 하나요?
감사합니다.
답변 4
<style>
ul.test_dot {
list-style-type: disc;
}
ul.test_dot li:first-child {
list-style-type: none;
}
</style>
<ul class="test_dot">
<li>첫번째 점 만 게거 - 사과</li>
<li>점 - 바나나</li>
<li>점 - 오렌지</li>
</ul>
배르만 님, 답변 감사합니다.
다음과 같은 방법도 있으니 참고해 보세요
<style>
.fruit-point {
list-style-type: disc;
}
.no-dot {
list-style-type: none;
}
</style>
<ul class="fruits-list">
<li class="fruit-point no-dot">사과</li>
<li class="fruit-point">바나나</li>
<li class="banana-sublist">
<ul>
<li>바나나 종류 1</li>
<li>바나나 종류 2</li>
<li>바나나 종류 3</li>
</ul>
</li>
<li class="fruit-point">오렌지</li>
<li class="fruit-point">배</li>
</ul>
.fruit-point 클래스에 대해 목록 스타일을 disc로 설정하고, 첫 번째 점인 사과에는 .no-dot 클래스를 추가하여 목록 스타일을 제거 하였으며, 이렇게 하면 첫 번째 사과 점은 점이 제거되고, 나머지 점은 표시될 것으로 생각합니다.
목록
첫번째 점 만 게거 - 사과
점 - 바나나
점 - 바나나 종류 1
점 - 바나나 종류 2
점 - 바나나 종류 3
점 - 오렌지
점 - 배
위와 같이 만들려고 하는데
첫번째 사과 점 제거 됩니다.
그런데 두번째 바나나 점도 제거 됩니다.
첫 번째 사과 점 만 없애고 싶어요.
처음 부터 위와 같이 질문을 드렸어야 하는데
죄송합니다.
감사합니다.
<style>
ul.test_dot {
list-style-type: disc;
}
ul.test_dot > li:first-child {
list-style-type: none;
}
</style>
<ul class="test_dot">
<li>첫번째 점 만 게거 - 사과</li>
<li>점 - 바나나
<ul>
<li>점 - 바나나 종류 1</li>
<li>점 - 바나나 종류 2</li>
<li>점 - 바나나 종류 3</li>
</ul>
</li>
<li>점 - 오렌지</li>
<li>점 - 배</li>
</ul>
답변을 작성하시기 전에 로그인 해주세요.
