Properties

Properties

Draft
  • account_tree
  • bug_report

object-fitCSS3

컨테이너의 크기에 맞게 이미지 또는 비디오 요소의 크기를 조정하는 방법을 지정한다.

설정 가능한 속성 값

  • fill기본값키워드CSS3

    컨텐츠 상자에 채우도록 한다.

  • contain키워드CSS3

    컨텐츠 상자에 자신의 비율을 유지하면서 가려지는 곳이 없이 보여지도록 한다.

  • cover키워드CSS3

    컨텐츠 상자에 자신의 비율을 유지하면서 채운다. 따라서 상자와 비율이 맞지 않으면 어느 한쪽은 잘리게 된다.

  • none키워드CSS3

    크기를 조정하지 않는다.

  • scale-down키워드CSS3

    상자 안에 내용물이 없거나 포함되지 않은 것 처럼 크기가 조정된다.

  • initial키워드CSS3

    웹 브라우저 기본 값으로 설정한다.

구문

  • object-fit fill or contain or cover or none or scale-down or initial;기본형식CSS3

테스트 도구

컨테이너 안의 이미지의 크기 설정 결과 테스트

버전 명세

Version NameDescriptionFlags
CSS3

지원 웹브라우저