Development/CSS & SCSS
[궁금증] 반응형 웹 div 너비 높이 비율 유지 방법
moretz0921
2020. 9. 7. 21:58
반응형 웹에서 div의 너비 높이 비율을 유지하는 방법
width 는 %
position
1. 더미 이미지 만들기
: 단점 이미지를 사용해야함.
1) 비율을 유지하는 더미 이미지(png)를 만든다. div에 태그 이미지 넣어주기.
2) 클래스를 준다. cover-dummy { max-width : 100%; height : auto; (이미지 특성상 높이 auto) }
-> 가변으로 사이즈 줄어든다.
-
2. paading-top 이용
: 부모의 너비를 padding-top: % 으로 로 가져옴.
1) 부모 { 너비 }
2) 자식 {padding-top : &; (세로사이즈 / 가로사이즈);}