css-5 : 문단과 목록 스타일

문단과 목록 스타일

---

정렬과 간격

속성	설명
text-align	텍스트 정렬 방식
letter-spacing	자간
word-spacing	단어간격
line-height	줄 높이

* 기본 html

  <p>
  고개들이 돌아, 진정해, 목 꺾일라
  분홍빛의 얼음 drip, drip, drip, freeze 'em on sight
  Shut it down, what-what-what-what?
  게임이 아냐, 진 적이 없으니까
  짖어봐, 네 목에 목줄은 내 거니까
  </p>

---

---

text-align

p {
  /* left, center, right, justify */
  text-align: center;
  }

---

---

letter-spacing

p {
  letter-spacing: 03px; 
  }

---

---

word-spacing

p{
  word-spacing: 3px;
 }

---

---

line-height

p{
  line-height: 10em;
 }  

---

___

list style

• disc, cricle, squre, “-“, 이모지, url, lower-alpha, upper-alpha 등
  

* 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 > li{
  list-style: url(https://showcases.yalco.kr/html-css/02-03/yalco.png)
}

ol {
  list-style: lower-alpha;
}