CSS _ 헷갈 속성 정리 2

1. 선택자

다음과 같은 상황에서...

<a>에 접근 : div > a

<p>에 접근 : div > a > p or div p

<li>에 접근 : div + li → div 기준 바로 다음에 오는 li에 접근!

 

2. div 내 text 세로 가운데 정렬

이렇게 속성을 주면...

(CloneName은 "TodoClone"을 둘러싸고 있는 div)

height만 늘어나고 글자는 본래 위치에 남고 만다.

 

text 세로 가운데 정렬을 위해 line-height 속성을 div 높이만큼 준다!

 

line-height는 줄 높이를 정하는 속성! (참고 : www.codingfactory.net/10639)

• normal : 웹브라우저에서 정한 기본값(보통 1.2)
• length : 길이로 줄 높이를 정함.
• number : 글자 크기의 몇 배인지로 줄 높이를 정함.
• percentage : 글자 크기의 몇 %로 줄 높이로 정함.
• initial : 기본값으로 설정.
• inherit : 부모 요소의 속성 값을 상속 받음.

그럼 세로 가운데 위치한 것처럼 보이게...된다.