aspect-ratio

뒤늦게 알아서 뼈아픈 유용한 CSS : aspect-ratio

뒤늦게 알아서 뼈아픈 유용한 css 시리즈는 내가 2년넘게 스스로 홈페이지 구축을 해오다 늦게 알아버린 css 모음이다. 또 까먹어서 어마어마한 시간을 들여 이 작은 css 한개를 구현하는 것을 막고자 블로그에 담는다. aspect-ratio aspect-ratio는 이미지나 객체의 비율을 지정해 반응형 등을 직관적으로 다룰 수 있게 도와준다. div { width: 100px; aspect-ratio: 4 / 3; /* 4:3 비율*/ } img, input[type="image"], video, embed, iframe, marquee, object, table { aspect-ratio: attr(width) / attr(height); } 호환성 : IE 빼고 전부 가능