メニュースキップ

전체보기
전체보기

메뉴보기 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
カテゴリー 番号 タイトル 日付 閲覧数
マニュアル 19 THEVOS Youtube BOARD SKIN 사용 설명 2018.11.11 130
CSS 18 Css 텍스트 외곽선 처리하기, Stroke 2019.11.28 131
EC-CUBE 2.x 17 EC-CUBE:SC_FormParamクラスによるパラメーターチェック方法 2019.10.03 139
EC-CUBE 2系 16 EC-CUBE 2系で注文を受けた商品の規格を後で削除すると、管理画面で受注内容を編集できなくなる 2020.01.02 153
EC-CUBE 2系 15 ECCUBE 2.13のインストール方法をスクリーンショット付きでわかりやすく徹底解説！ file 2019.10.10 153
EC-CUBE 2系 14 イベントセット販売プラグインマニュアル file 2019.11.07 156
EC-CUBE 2系 13 EC-CUBE標準規約 2019.09.28 165
EC-CUBE 2系 12 リファクタリングガイドライン 2019.09.28 181
EC-CUBE 3系 11 관리 화면의 사이드 메뉴에 항목 추가하는 방법 file 2019.11.11 186
EC-CUBE 3.x 10 デフォルトのtitleを任意のものに変更する方法 file 2019.04.10 242
EC-CUBE 2.x 9 商品数や階層に関係なく全カテゴリーを表示させる方法 file 2019.04.10 271
EC-CUBE 4.x 8 EC-CUBE 4를 설치했을 때 설정 한 데이터베이스 암호는 어디에 저장되는 것입니까? 2019.11.14 402
EC-CUBE 2.x 7 EC-CUBE에서 모든 페이지에서 로그인 체크하기 2019.11.11 470
ヒント＆ノウハウ共有 6 구글 캘린더 합치기 1 file 2018.12.12 509
EC-CUBE 4系 5 EC-CUBE4系で管理画面に新規メニュー項目を追加する方法 file 2019.10.28 517
EC-CUBE 2系 4 EC-CUBE 2系の「もっと見る」を簡潔に 2020.01.02 639
EC-CUBE 2系 3 EC-CUBE2.13カスタマイズ：新しいページを追加する file 2019.11.11 663
EC-CUBE 2.x 2 EC CUBEで商品ごとに支払い方法を簡単に分ける file 2019.10.28 684
EC-CUBE 3.x 1 新規作成したページURLから「user_data」を消す方法とURLを出力するテンプレートタグ file 2019.04.10 1217
書き込む
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