🔘 pc버전에서는 X축, 모바일버전에서는 y축 정렬
☑ 크기를 3등분 할 때에는 최대한 오차를 적게, 33.3333% 설정
.intro nav ul li {
width: 33.3333%;![]
}

☑ 앞선 형제tag가 3차원일 경우, 뒤의 형제tag는 앞선 형제tag의 뒤로 가면서 layout 겹침 현상이 발생한다. -> padding을 활용해서 해결
.intro nav ul {
list-style: none;
padding: 0;
margin: 0;
}
.intro nav ul {
list-style: none;
padding: 0;
margin: 0;
}
main {
width: 100%;
height: 2000px;
background-color: gold;
padding-top: 80px;
}
☑ img태그는 기본적으로 공백을 가지고 있기 때문에 vertical align: middle;
을 default 값으로 넣어준다.
.column img {
width: 100%;
vertical-align: middle;
}
1. 하나의 css 파일에 pc / mobile 모두 작성 (2000 code 이하 권장)
2. pc / mobile 따로 css 파일 생성 ( 2000 code 이상 권장)
3. style tag 활용
<style media="(min-width: 300px)
and (max-width: 700px)">
body {
background-color: red;
}
</style>