该 object-fit CSS 属性指定替换元素的内容应该如何适应到其使用的高度和宽度确定的框。

初始值 fill 
适用于 替换元素 
遗传 是 
媒体 视觉 
计算值 按规定 
动画类型 离散的 
为了规范 通过正规的语法定义的唯一无歧义的秩序 
/* 关键属性 */

object-fit: fill;
object-fit: contain;
object-fit: cover;
object-fit: none;
object-fit: scale-down;
  • 1
  • 2
  • 3
  • 4
  • 5

/* 全局属性 */ 
object-fit: inherit; 
object-fit: initial; 
object-fit: unset; 
初始值 fill 
适用元素 replaced elements 
是否是继承属性 否 
适用媒体 visual 
计算值 as specified 
Animation type discrete 
正规顺序 the unique non-ambiguous order defined by the formal grammar 
句法

object-fit属性由下列的值中选择一个关键字来指定。

值 
fill 
被替换的内容的大小,以填补该元素的内容框:对象的具体对象的大小是元素的使用宽度和高度。 
contain 
被替换的内容的大小,为自身宽高比不变,适应该元素的内容框的大小:它的具体对象的大小被解析为对元素的使用宽度和高度的含有约束。 
cover 
被替换的内容的尺寸却使元件的整个内容框,以保持其长宽比其具体的对象的大小被解析为针对元素的使用的宽度和高度的盖约束。 
none 
被替换的内容的尺寸却使元件的整个内容框,以保持其长宽比其具体的对象的大小被解析为针对元素的使用的宽度和高度的盖约束。 
scale-down 
内容的尺寸仿佛none或contain指定了,取将导致更小的具体对象的大小。

obj-fit的更多相关文章

  1. Emsemble

    RM # -*- coding: utf-8 -*- """ RandomForestClassifier 예 """ import pan ...

  2. Classification

    kNN1 # -*- coding: utf-8 -*- """ kNN : 최근접 이웃 """ import numpy as np # ...

  3. sklearn的基本使用

    https://cloud.tencent.com/developer/news/58202 简介 今天为大家介绍的是scikit-learn.sklearn是一个Python第三方提供的非常强力的机 ...

  4. OBJ解析

    OBJ文件是Alias|Wavefront公司为它的一套基于工作站的3D建模和动画软件"Advanced Visualizer"开发的一种标准3D模型文件格式,很适合用于3D软件模 ...

  5. 3D中的OBJ文件格式详解

    常见到的*.obj文件有两种:第一种是基于COFF(Common Object File Format)格式的OBJ文件(也称目标文件),这种格式用于编译应用程序:第二种是Alias|Wavefron ...

  6. OBJ文件

    OBJ文件是Alias|Wavefront公司为它的一套基于工作站的3D建模和动画软件"Advanced Visualizer"开发的一种标准3D模型文件格式,很适合用于3D软件模 ...

  7. openGL加载obj文件+绘制大脑表层+高亮染色

    绘制大脑表层并高亮染色的工作是以openGL加载obj文件为基础的,这里是我们用到的原始程序:只能加载一个obj文件的demo. 然而,一个完整的大脑表层是由很多分区组成的,因此我们的程序需要支持两个 ...

  8. 3D中OBJ文件格式详解

    常见到的*.obj文件有两种:第一种是基于COFF(Common Object File Format)格式的OBJ文件(也称目标文件),这种格式用于编译应用程序:第二种是Alias|Wavefron ...

  9. obj.style.z-index的正确写法

    obj.style.z-index的正确写法 今天发现obj.style.z-index在js里面报错,后来才知道在js里应该把含"-"的字符写成驼峰式,例如obj.style.z ...

  10. CSharpGL(9)解析OBJ文件并用CSharpGL渲染

    CSharpGL(9)解析OBJ文件并用CSharpGL渲染 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码中包含10多个独立的Demo ...

随机推荐

  1. 1.4(学习笔记)JSP自定义标签

    一.JSP自定义标签 JSP自定义标签,可以通过实现Tag接口.继承TagSupport类来设置标签功能. 后续通过配置文件将标签和具体的实现类关联. 二.自定义第一个标签(实现Tag接口) 自定义标 ...

  2. linux下分区相关知识

    Linux 规定了主分区(或者扩展分区)占用 1 至 16 号码中的前 4 个号码.以第一个 IDE 硬盘为例说明,主分区(或者扩展分区)占用了 hda1.hda2.hda3.hda4,而逻辑分区占用 ...

  3. 【JVM】调优笔记1-----堆栈概念的对碰

    关于JVM的工作原理以及调优是一个向往已久的模块,终于有幸接触到:http://pengjiaheng.iteye.com/blog/518623 那就顺着这个思路,来梳理一下自己看到后的结论和感想. ...

  4. PostgreSQL配置文件--复制

    4 复制 REPLICATION 4.1 Sending Server(s) 4.1.1 max_wal_senders 数字型 默认: max_wal_senders = 10 , 为0表示启用流复 ...

  5. ylbtech-LanguageSamples-Generics(泛型)

    ylbtech-Microsoft-CSharpSamples:ylbtech-LanguageSamples-Generics(泛型) 1.A,示例(Sample) 返回顶部 “泛型”示例 (C#) ...

  6. php之防注入程序绕过浅谈

    <?php/*判断传递的变量是否含有非法字符如:$_POST/$_GET功能:SQL防注入系统*/ //屏蔽错误提示error_reporting(7); //需要过滤的字符 $ArrFiltr ...

  7. 更改Windows用户文件夹(Users)默认位置到其它盘

    一.把 C盘Users文件夹里的用户数据,迁移到D盘Users文件夹中 系统环境:windows7 1.mklink命令详解 C:>mklink 创建符号链接. MKLINK [[/D] | [ ...

  8. nfs mount 故障 mount.nfs: access denied by server while mounting 10.0.100.208:/backup_usb

    生产环境: 服务端centos7.2,客户端:ubuntu16.04 挂载出现的故障: root@HDCtrl100:/mnt# mount -t nfs 10.0.100.208:/backup_u ...

  9. python 推导式(Comprehensions)

    一.介绍 列表推导(list comprehensions) 这是一种将for循环.if表达式以及赋值语句放到单一语句中的一种方法.换句话说,你能够通过一个表达式对一个列表做映射或过滤操作. 一个列表 ...

  10. 【JavaScript】Bootstrap3-dialog挺好用

    参考资料: http://stackoverflow.com/questions/28436634/getting-error-uncaught-referenceerror-bootstrapdia ...