정보실

웹학교

정보실

css 가변 폭의 요소가 주어지면, 높이가 반응하는 방식

본문

HTML : 

<div class="constant-width-to-height-ratio"></div>


CSS : 

.constant-width-to-height-ratio {
  background: #333;
  width: 50%;
}
.constant-width-to-height-ratio::before {
  content: '';
  padding-top: 100%;
  float: left;
}
.constant-width-to-height-ratio::after {
  content: '';
  display: block;
  clear: both;
}




  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기
  • 카카오톡으로 보내기

페이지 정보

조회 64회 ]  작성일18-08-31 23:20
css

웹학교