img 태그의 기본 속성은 span이다 글자를 위한 속성으로 잡힘
baseline으로 잡혀있기 때문에 뜬다.
span 태그는 inline 태그이니까, img 태그의 display를 block으로 바꾸면 수직 정렬 기준을 base line으로 잡지 않고 크기를 기준으로 잡는다.
결론 : img 태그를 수직정렬할 때는 display를 block으로 바꿔줘야 한다.
top bottom left right과 margin auto는 기준점을 줘야 제대로 작동된다.
요소한테 transition을 걸면 돌아갈 때도 예쁘게 돌아간다.
바뀌는 것에 transition을 거는 것은 돌아갈때는 적용 X
메인 메뉴 뼈대
<div class="main_menu">?
이전 Sub 메뉴의 경우는 Search 메뉴를 포함 하기 위해서 div로 선언
메뉴만 있다면! <ul>을 사용
메뉴 아이템에 컨텐츠도 같이 있으므로!?
각각 items 의 자식 요소로 item__name / item__contents
x 6개!
position: fixed 는 뷰포트를 기준으로 쌓인다.
a 태그는 span임
margin을 주려면 display: block 선언
url은 한 단계 더 들어가있으니 상대경로 ../를 사용하는 것이 좋다.
background-image의 기본은 짧은축에 맞추는 contain이다.
static일 때는 top이 안먹으니, margin으로 준다.
특
transition-delay 각각 딜레이시간을 다르게 준 다음에 hover 적용
img태그는 float가 잘 먹는다.
text는 text-align이 잘 먹는다.
top을 주지않아서
부모를 따라가는 위치에 존재하게 하는 방법 1
아니면 top값을 계산해서 주는 것 2
