HTML & CSS/CSS

[CSS] 문단과 목록 스타일

newbieC 2022. 8. 8. 15:41

- ol,ul에 스타일 주기

- HTML

<ul>
    <li>ul 아이템 1</li>
    <li>ul 아이템 2</li>
    <li>ul 아이템 3</li>
  </ul>
  <ol>
    <li>li 아이템 1</li>
    <li>li 아이템 2</li>
    <li>li 아이템 3</li>
  </ol>

- CSS

ul {
  list-style: circle;
}

ul > li:last-child{
  list-style: "🚩 "
}

ol {
  list-style: lower-alpha;
}

해당 list에 list-style을 주고 원하는 값을 넣는다. (이모지도 된다는 점.)

문단 정렬

p {
  /* 정렬 */
  text-align: left;
  /* 글자간 간격 */
  letter-spacing: 0;
  /* 단어간 간격 */
  word-spacing: 0;
  /* 라인간 간격 */
  line-height: 1.5em;
}

참조