给新手的福利,还是记一下吧.......很简单

<div>
<img src="1.jpg" alt="">
</div> div{
width: 100px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
} img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
}

(普及知识: 小程序更简单(使图片的长边能完全显示出来)  直接修改  mode值)

css设置图片根据最大边自适应的更多相关文章

  1. css设置图片居中、居左、居右

      CreateTime--2017年12月8日14:25:09 Author:Marydon css设置图片居中.居左.居右 图片一般默认是居左显示的,如何更改它的水平位置呢? <div st ...

  2. (转) JAVA中如何设置图片(图标)自适应Jlable等组件的大小

    一.问题: 一个程序,组件上设置某个图片作为图标,因为的label(应该说是组件)已经设定了固定大小, 所以再打开一些大图片时,超过组件大小的部分没显示出来,而小图片又没填充完整个组件 二.解决这个问 ...

  3. CSS设置图片垂直居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

  4. CSS设置图片居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

  5. css设置图片水平及垂直居中

    .box { /*非IE的主流浏览器识别的垂直居中的方法*/ display: table-cell; vertical-align:middle; /*设置水平居中*/ text-align:cen ...

  6. 关于HTML+CSS设置图片居中的方法

    有的时候我们会遇到这样一个问题,就是当我们按下F12进行使用firebug调试的时候,我们发现图像没有居中,页面底下有横向的滑动条出现,图片没能够居中,默认状态下只是紧靠在页面最左侧,而我们对图像缩小 ...

  7. css设置图片的透明度

    在图片的属性中加上{filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;}   opacity是 ...

  8. css设置图片百分比显示,最简洁的代码

    css代码: .img-box { padding-bottom: 100%; } .img-box img { position: absolute; top:; bottom:; left:; r ...

  9. css设置图片的高等于图片的高

    <div class="box"> <img src="img/2222.jpg" /> </div> .box { pos ...

随机推荐

  1. 痞子衡嵌入式:恩智浦i.MX RTxxx系列MCU启动那些事(7)- 从SD/eMMC启动

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是恩智浦i.MXRTxxx系列MCU的SD/eMMC卡启动. 关于 i.MXRT 启动设备,痞子衡之前写过很多篇文章,都是关于串并行 NO ...

  2. SQL从零到迅速精通【表连接查询】

    看了这些表连接,个人感觉'左外连接'.'右外连接'和'全外连接'应用好就可以了. 1.外连接 (1)LEFT JOIN(左连接):返回包括左表中的所有记录和右表中连接字段相等的记录. 在student ...

  3. laravel7 验证器的使用

    $validator=\Validator::make($request->all(),[ 'username'=>'required', 'password'=>'required ...

  4. Laravel-QueryList-采集

    <?php namespace App\Http\Controllers; use App\Models\NewsModel; use Illuminate\Http\Request; use ...

  5. PhpStorm中绘画UML

    IDE支持 在Plugins中 安装PlantUML integration插件 到http://www.graphviz.org/网站下载graphviz.exe并安装(这个软件可以支持更多的UML ...

  6. 为什么我的MySQL会“抖”一下?

    不知道你有没有遇到过这样的场景,一条 SQL 语句,正常执行的时候特别快,但是有时也不知道怎么回事,它就会变得特别慢,并且这样的场景很难复现,它不只随机,而且持续时间还很短. 1)InnoDB 在处理 ...

  7. AE初步

    AE开发就是我们常说的ArcEngine二次开发. 1.配置环境 目前来讲,稳定的版本配置,一般配置为VS2012+ArcEngine10.2. 安装ArcEngine时,安装图中三项即可,顺序为Ar ...

  8. vite2 打包的时候vendor-xxx.js文件过大的解决方法

    vite2是一个非常好用的工具,只是随着代码的增多,打包的时候 vendor-xxxxxx.js 文件也越来越大,这就郁闷了. 打包时遇到警告 输出文件名字/static/vendor.9b5698e ...

  9. LFS系列镜像在阿里云镜像站首发上线

    LFS镜像 镜像详情页: https://developer.aliyun.com/mirror/lfs Linux From Scratch (LFS) 是一个项目,它为您提供完全从源代码构建您自己 ...

  10. CVE-2017-11882(Office远程代码执行)

    测试环境:win7+kali+office 2007 xp+kali+office 2003 win7 ip:10.10.1.144 xp ip: 10.10.1.126 kali ip 10.10. ...