contain

被替换的内容将被缩放，以在填充元素的内容框时保持其宽高比。 整个对象在填充盒子的同时保留其长宽比，因此如果宽高比与框的宽高比不匹配，该对象将被添加“黑边”。

cover

被替换的内容在保持其宽高比的同时填充元素的整个内容框。如果对象的宽高比与内容框不相匹配，该对象将被剪裁以适应内容框。

fill

被替换的内容正好填充元素的内容框。整个对象将完全填充此框。如果对象的宽高比与内容框不相匹配，那么该对象将被拉伸以适应内容框。

none

被替换的内容将保持其原有的尺寸。

scale-down

内容的尺寸与 none 或 contain 中的一个相同，取决于它们两个之间谁得到的对象尺寸会更小一些。

object-fit 详解的更多相关文章

  1. 【转载】html中object标签详解

    [转载自http://blog.csdn.net/soliy/archive/2010/03/22/5404183.aspx] html标签之Object标签详解 作者:网络    出处:网络     ...

  2. Vue不兼容IE8原因以及Object.defineProperty详解

    Vue不兼容IE8原因以及Object.defineProperty详解 原因概述: Vue.js使用了IE8不能模拟的ECMAScript5特性. Vue.js支持所有兼容ES5的浏览器. Vue将 ...

  3. JAVA中Object类方法详解

    一.引言 Object是java所有类的基类,是整个类继承结构的顶端,也是最抽象的一个类.大家天天都在使用toString().equals().hashCode().waite().notify() ...

  4. java的object类函数详解

    1．clone方法(浅拷贝) 保护方法,实现对象的浅复制,只有实现了Cloneable接口才可以调用该方法,否则抛出CloneNotSupportedException异常. 主要是JAVA里除了8种 ...

  5. html中object标签详解

        定义和用法 object标签定义一个嵌入的对象.请使用此元素向您的 XHTML 页面添加多媒体.此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码. &l ...

  6. html标签之Object标签详解

    定义和用法 定义一个嵌入的对象.请使用此元素向您的 XHTML 页面添加多媒体.此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码. <object> ...

  7. @synchronized (object)使用详解

    synchronized关键字代表这个方法加锁,相当于不管哪一个线 程A每次运行到这个法时,都要检查有没有其它正在用这个方法的线程B(或者C D等),有的话要等正在使用这个方法的线程B(或者C D)运 ...

  8. Java提高学习之Object类详解（1）

    转自:http://www.importnew.com/10304.html 问:什么是Object类? 答:Object类存储在java.lang包中,是所有java类(Object类除外)的终极父 ...

  9. Java常用类（一）之Object类详解

    大家都知道Object是所有类的父类,任何类都默认继承Object 理论上Object类是所有类的父类,即直接或间接的继承java.lang.Object类.由于所有的类都继承在Object类,因此省 ...

  10. ES6之Object.assign()详解

    译者按: 这篇博客将介绍ES6新增的Object.assign()方法. 原文: ECMAScript 6: merging objects via Object.assign() 译者: Funde ...

随机推荐

  1. RunTime 启动bat程序

    bat文件路径 String cmd= PathUtil.appPath + File.separator + "nginx-1.14.2"+ File.separator +&q ...

  2. Webservice报错客户端发现响应内容类型为“application/json;charset=UTF-8”，但应为“text/xml”。

    控制台对接Webservice正常,同样的方法在Web项目上报错: 客户端发现响应内容类型为“application/json;charset=UTF-8”,但应为“text/xml”.请求失败,错误 ...

  3. command三国杀开发日记20200915

    一句话进展 完善了程序结构,分离.c和.h 搭建了6个阶段函数 实现了玩家摸牌 封装实现了日志打印函数 日志打印 想要区分日志等级,包括DEBUG.INFO.WARN.ERRRO.PANIC,提供统一 ...

  4. JDK15正式发布，新增功能预览！

    JDK 15 在 2020 年 9 月 15 号正式发布了,这次发布的主要功能有: JEP 339:EdDSA 数字签名算法 JEP 360:密封类(预览) JEP 371:隐藏类 JEP 372:删 ...

  5. js中的鼠标滚轮事件

    ## 事件对象 event 1 event事件对象,表示用来获取事件的详细信息,比如得到鼠标的横坐标:事件对象.clientX(clientX是可视区坐标) window.onclick = func ...

  6. vue2.5开发去哪儿了流程

    初始化项目 在 src/assets 中添加样式初始化文件 reset.css ; border.css 本地引入取消延迟300毫秒的控件 cnpm i fastclick -S 在mian.js中引 ...

  7. Apache Flink on K8s：四种运行模式，我该选择哪种？

    1. 前言 Apache Flink 是一个分布式流处理引擎,它提供了丰富且易用的API来处理有状态的流处理应用,并且在支持容错的前提下,高效.大规模的运行此类应用.通过支持事件时间(event-ti ...

  8. Python爬虫之反爬虫---使用随机User-Agent

    在编写爬虫时,大多数情况下,需要设置请求头.而在请求头中,随机更换User-Agent可以避免触发相应的反爬机制. 使用第三方库fake-useragent便可轻松生成随机User-Agent. 使用 ...

  9. XSS基础笔记 from 《Web安全攻防 渗透测试实战指南》

    XSS漏洞介绍 跨站脚本(Cross Site Scripting, 简称为XSS或跨站脚本或跨站脚本攻击)是一种针对网站应用程序的安全漏洞攻击技术,是代码注入的一种.它允许恶意用户将代码注入网页,其 ...

  10. （转载）Altium Designer 17 (AD17)

    转载自:http://blog.csdn.net/qq_29350001/article/details/52199356 以前是使用DXP2004来画图的,后来转行.想来已经有一年半的时间没有画过了 ...