개발/CSS

ul, li 블릿,기호,점 스타일 변경 및 없애기

알 수 없는 사용자 2021. 1. 3.
반응형

ul, li 스타일은 8가지가 있다. 또한 블릿이 필요없을 경우에는 블릿을 없앨 수 있다.

 

기본 스타일이라 별도의 스타일 지정 필요 없음


테두리만 있는 원형

ul{
  list-style-type : circle;
}

네모 모양

ul{
  list-style-type : square;
}

숫자 형식(1. 2. 3. ~)

ul{
  list-style-type : decimal;
}

소문자 형식(a. b. c. ~)

ul{
  list-style-type : lower-alpha;
}

대문자 형식(A. B. C. ~)

ul{
  list-style-type : upper-alpha;
}

소문자 로마자 형식(i. ii. iii. ~)

ul{
  list-style-type : lower-roman;
}

대문자 로마자 형식(I. II. III. ~)

ul{
  list-style-type : upper-roman;
}

블릿 삭제

ul{
  list-style : none;
  padding-left : 0px;
}

예제

See the Pen ul li 예제 by jess (@jess44) on CodePen.

반응형

댓글

💲 추천 글