[HTML] li 점 없애기 + 변경해보기

 

안녕하세요.

 

오늘은 HTML에서 자주 사용하는 li태그에서 점을 없애는 방법을 알려드리겠습니다.

 

일단 HTML에서 li태그를 만들어보겠습니다.

 

반응형

<ul>
    <li>왕초보의</li>
    <li>뭐라도 만들어보자</li>
<ul>

 

이렇게 잘 만들어졌죠?

 

 

자 앞에 점을 없애볼까요?

 

<ul>
    <li style="list-style:none;">왕초보의</li>
    <li>뭐라도 만들어보자</li>
<ul>

 

두개중에 하나만 적용해보겠습니다.

 

 

이렇게 결과물이 나왔습니다.

 

정말 쉽죠??

 

CSS로 표현하는 방식도 적어보겠습니다.

li {
    list-style:none;
}

 

대신 이렇게 작성하면 모든 li태그는 점이 다 사라집니다.

 

선택적으로 사용하시면 됩니다.

! 번외 !

 

    <ul>
        <li style="list-style: none;">왕초보의</li>
        <li style="list-style:inside;">뭐라도 만들어보자!</li>
        <li style="list-style:georgian;">뭐라도 만들어보자!</li>
        <li style="list-style:armenian;">뭐라도 만들어보자!</li>
        <li style="list-style:square;">뭐라도 만들어보자!</li>
        <li style="list-style:circle;">뭐라도 만들어보자!</li>
        <li style="list-style:decimal;">뭐라도 만들어보자!</li>
    </ul>

 

여러가지 더 있지만 가볍게 보여드리겠습니다.

 

1. 아무것도 없게

 

2. 들여쓰기

 

3. 조지아어 (그냥 넣어봄)

 

4. 아르메니아어 (그냥 넣어봄)

 

5. 네모

 

6. 동그라미

 

7. 소수

 

 

끝!