使用css

img {

    object-fit: cover;

    object-position:left center;

}

就可以达到 和 background-size:cover; 一样的效果

共有几下面几个值

object-fit: fill;

object-fit: contain;

object-fit: cover;

object-fit: none;

object-fit: scale-down;

目前查到的兼容性是：（2019年3月16日）基本不会有太大的问题，特别是做企业软件市场，你可以指定客户使用合适的客户端

使用img标签能使用background-size:conver一样的效果的更多相关文章

  1. css 使用background背景实现border边框效果

    css中,我们一般使用border给html元素设置边框,但也可以使用background背景来模拟css边框效果,本文章向大家介绍css 使用background背景实现border边框效果,需要的 ...

  2. css样式之background详解（格子效果）

    background用法详解: 1.background-color 属性设置元素的背景颜色 可能的值 color_name            规定颜色值为颜色名称的背景颜色(比如 red) he ...

  3. jQuery操作标签，jQuery事件操作，jQuery动画效果，前端框架

    jQuery操作标签 jQuery代码查找标签绑定的变量名推荐使用 $xxxEle 样式类操作 addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类 ...

  4. marquee标签属性详解（跑马灯文字效果）

    请大家先看下面这段代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...

  5. antd源码分析之——标签页（tabs 3.Tabs的滚动效果）

    由于ant Tabs组件结构较复杂,共分三部分叙述,本文为目录中第三部分(高亮) 目录 一.组件结构 antd代码结构 rc-ant代码结构 1.组件树状结构 2.Context使用说明 3.rc-t ...

  6. HTML 标签 表格

    <html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> <body& ...

  7. HTML基础（一）——一般标签、常用标签和表格

    第一部分  HTML <html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> ...

  8. HTML标签----图文详解

    国庆节快乐,还在加班的童鞋,良辰必有重谢! 本文主要内容 头标签 排版标签:<p>     <br>     <hr>     <center>     ...

  9. HTML常用标签跟表格

    <html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> <body& ...

随机推荐

  1. centos7上安装python3

    一.安装环境及版本 CentOS 6.5 Python 3.6.1 二.安装依赖包 1.安装静态库 # yum install -y openssl-static 注:如果不安装该静态库,会导致pyt ...

  2. minimal sparse ruler problem 最少尺子刻度问题

    一个长度13的尺子,如果在1位置刻点可以量出1和12,13三种刻度.那么至少刻几个点,可以直接量出1-13所有的长度,分别刻在哪几个位置? 注:必须是直接量.即在尺子上能找出一个1-13任意的整数长度 ...

  3. 让UpdatePanel支持文件上传（2）：服务器端组件 .

    我们现在来关注服务器端的组件.目前的主要问题是,我们如何让页面(事实上是ScriptManager控件)认为它接收到的是一个异步的回送?ScriptManager控件会在HTTP请求的Header中查 ...

  4. Ionic控件之——按钮（Button)

    Ionic提供丰富的按钮特性,足以满足大部分的按钮实现需求. 一.HTML实现一个简单按钮: <button class="button"> 我是按钮 </but ...

  5. python3.6+GDAL-2.1.3环境配置

    1.下载地址:http://www.lfd.uci.edu/~gohlke/pythonlibs/#gdal 2.配置:见上图命令(跟以前相似) 3.测试:

  6. CRF++ 如何制定自己的特征模板

    工具的简单介绍 对该工具的安装及介绍我这里就不再赘述,请参考官方文档或者国内一些翻译后的中文版.也还比较清楚. 我只介绍一下crf++在命名实体识别中的一些用法,这些都建立在你了解crf++的一些最基 ...

  7. 奇怪的bug，不懂Atom在添加markdown-themeable-pdf，在配置好phantomjs的情况下报错

    本来打算用一下atom但是导出pdf报错,可是在预览的情况下就没有问题,顺便吐槽一下谷歌浏览器自己的markdown在线预览插件无法适配,用搜狗搭载谷歌的插件才能导出pdf,一下感觉逼格少了很多,等忙 ...

  8. Scala编译器安装

    1.安装JDK 因为Scala是运行在JVM平台上的,所以安装Scala之前要安装JDK. 2.安装Scala Windows安装Scala编译器 访问Scala官网http://www.scala- ...

  9. nginx+lvs+keepalived安装

    安装nginx 配置文件和之前的一样 user nobody nobody;    #定义Nginx运行的用户和用户组 worker_processes 4;    #nginx进程数,建议设置为等于 ...

  10. java二维数组定义初始化-杨辉三角

    public class Array2Demo2_3 { public static void main(String[] args) { //定义初始化 int[][] arr = new int[ ...