2021-07-01 (얼라인 middle 과 nth-child/nth-of-type)

vertical-align 과 align 은 MIDDLE을 줄수 있으며 같은줄에 있는것들을 MIDDLE 처리할 수 있음

 

 

[NTH-CHILD]

<main> <!--메인컨텐츠-->

<div>
<h3>연합뉴스</h3> main

<p>
<h3>언론사목록</h3>   =>main h3:nth-child(3) 이된다. 왜냐면 <p>도포함하여 카운팅하기때문에 <p>는 (2)가 되기때문
<ul>
<li><img src="./동아일보.png" alt="동아일보"/></li>
<li><img src="./이데일리.png" alt="이데일리"/></li>
</ul>

 

[NTH-OF-TYPE]

<main> <!--메인컨텐츠-->

<div>
<h3>연합뉴스</h3> main

<p>
<h3>언론사목록</h3>   =>main h3:nth-child(2) 이된다. 왜냐면 <p>를 생략하고 오로지 h3만 카운팅
<ul>
<li><img src="./동아일보.png" alt="동아일보"/></li>
<li><img src="./이데일리.png" alt="이데일리"/></li>
</ul>