メニュースキップ

전체보기
전체보기

메뉴보기 search
マニュアル
THEVOS WebMail
         
배경이미지

マニュアル

お知らせ

✔ Viewer
CSS

CSS オブジェクトフィットプロパティ

by TheVOS posted Dec 04, 2019
?

Shortcut

Prev前へ 書き込み

Next次へ 書き込み

Larger Font Smaller Font 上へ 下へ Go comment 印刷 添付
?

Shortcut

Prev前へ 書き込み

Next次へ 書き込み

Larger Font Smaller Font 上へ 下へ Go comment 印刷 添付
Extra Form
原文出所 https://www.w3schools.com/css/css3_object-fit.asp

object-fit 속성은 IMG, VIDEO 태그의 크기를 컨테이너에 맞게 자정하는데 사용됩니다.


브라우저 지원

테이블의 숫자는 완전히 속성을 지원하는 최초의 브라우저 버전을 지정합니다.

Propertyicon-chrome1.png icon-edge.png icon-firefox1.png icon-safari1.png icon-opera1.png
object-fit31.016.036.07.119.0
특징설명
기본 값object-fit : 개별적 속성
상속안됨
애니메이션안됨
적용-
버전CSS3

정의(Definition)

  • object-fit 속성은 <img>, <video> 태그의 크기를 정의합니다.

문법(Syntax)

object-fit: fill | contain | cover | scale-down | none

속성(Property)

속성값설명
fill컨텐츠 사이즈 크기에 맞게 설정합니다.
contain컨텐츠의 가로 값을 기준으로 맞게 설정합니다.
cover컨텐츠 화면 사이즈에 맞게 설정합니다.
scale-down컨텐츠 크기 보다 작게 설정합니다.


Original

FILL

CONTAIN

COVER

NONE

SCALE-DOWN




object-fit: fill;
object-fit: contain;
object-fit: cover;
object-fit: none;
object-fit: scale-down;


Facebook [ja]コメント 

Atachment
添付 '6539'
Facebook Twitter Google Pinterest
上へ 下へ Go comment 印刷 添付
Select Editor
?
List of Articles
カテゴリー 番号 タイトル 日付 閲覧数
ヒント＆ノウハウ共有 39 페이스북위젯 삽입하기 file 2018.12.15 65
クラス 38 클래스의 사용 2019.10.03 108
クラス 37 클래스의 구조 2019.10.03 53
クラス 36 클래스와 객체의 기초 file 2019.10.03 74
メールサービス 35 메일 사용자 설명서 2019.03.29 123
ヒント＆ノウハウ共有 34 구글 캘린더 합치기 1 file 2018.12.12 525
EC-CUBE 3系 33 관리 화면의 사이드 메뉴에 항목 추가하는 방법 file 2019.11.11 187
EC-CUBE 4系 32 管理機能一覧 2020.11.12 49
EC-CUBE 3.x 31 新規作成したページURLから「user_data」を消す方法とURLを出力するテンプレートタグ file 2019.04.10 1220
EC-CUBE 2.x 30 商品数や階層に関係なく全カテゴリーを表示させる方法 file 2019.04.10 273
EC-CUBE 2.x 29 商品名などで長くなったテキストを省略する方法 file 2019.04.10 67
EC-CUBE 2.x 28 商品ステータスを変更・追加する方法 file 2019.04.10 80
EC-CUBE 2系 27 単体テストガイドライン 2019.09.28 128
EC-CUBE 2系 26 リファクタリングガイドライン 2019.09.28 184
EC-CUBE 4系 25 フロント機能一覧 2020.11.12 47
EC-CUBE 3.x 24 デフォルトのtitleを任意のものに変更する方法 file 2019.04.10 244
EC-CUBE 2.x 23 サイトデザインをPCで統一させる方法 file 2019.04.10 72
EC-CUBE 2系 22 イベントセット販売プラグインマニュアル file 2019.11.07 157
EC-CUBE 3.x 21 titleの並びや区切り記号を変更する方法 file 2019.04.10 112
マニュアル 20 THEVOS Youtube BOARD SKIN 사용 설명 2018.11.11 131
書き込む
Board Pagination Prev 1 2 Next
/ 2

お客様のビジネススタイルの価値を大切にする企業THEVOSです。 THEVOSは、お客様との緊密な外部ITチームです。

株式会社ザボスECO研究所

  • 〒812-0029　福岡市博多区古門戸町10-5-501
  • 日本：080-3984-5969 韓国：070-4809-0019
  • webmaster@thevos.jp

Copyright © 2009/2024 株式会社ザボスECO研究所. All Rights Reserved.

Design by THEVOS
CLOSE