[css] list 2열배치와 list-style종류

[css] 리스트 list 2열 배치 display grid 그리드

가로값이 정확할때는 display:flex를 주어 2열로 list를 정리할 수 있지만,
width값이 정확하지않을때는 grid를 사용하여 리스트를 목록화한다.

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

ul{display: grid; grid-template-columns: 1fr 1fr;}

grid-template-columns에서 지정된 갯수만큼 배열이 되며, fr은 자동으로 동일 column값(가로값)을 인식한다

list-style종류에 대해 알아보자

차례로

1. list-style:none;
   -none는 아무 기호가 없습니다.

2. list-style:disc;
   -disc는 기본값으로 많은 목록에 쓰입니다.

3. list-style:circle;
   -circle은 가운데가 비어있는 원 모양 입니다.

4. list-style:square;
   -square은 정사각형 모양입니다.

5. list-style:decimal;
   -decimal은 숫자로 나타냅니다.

6. list-style:decimal-leading-zero;
   -decimal-leading-zero은 0이 들어가있는 숫자로 표현됩니다.

7. list-style:lower-roman;
   -lower-roman은 소문자 로마숫자입니다.

8. list-style:upper-roman;
   -upper-roman은 대문자 로마숫자입니다.

9. list-style:lower-greek;
   -lower-greek은 알파, 베타, 감마, 델타, 입실론...

10. list-style:lower-alpha;
    -lower-alpha, lower-latin는 동일하게 라틴(알파벳)순으로 나옵니다.
    z가 끝난 후 aa부터 시작합니다.

11. list-style:armenian;
    -armenian은 아르메니아 공화국의 언어이며 아르메니아 공화국은 터키 옆에 있는 나라입니다.

12. list-style:cambodian;
    -cambodian는 캄보디아어 입니다.

13. list-style:cjk-ideographic;
    -cjk-ideographic 갑, 을, 병, 정, 무... : 한국어에서는 이렇게 뜨며 언어별로 다릅니다.

14. list-style:georgian;
    -georgian는 조지아어 입니다.

15. list-style:hebrew;
    -hebrew는 히브리어 입니다.

16. list-style:"\1F44D";
    -\1F44D는 유니코드 아이콘입니다.
    유니코드로 문자등을 나타낼수 있습니다.