css设置图片根据最大边自适应
给新手的福利,还是记一下吧.......很简单

<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设置图片根据最大边自适应的更多相关文章
- css设置图片居中、居左、居右
CreateTime--2017年12月8日14:25:09 Author:Marydon css设置图片居中.居左.居右 图片一般默认是居左显示的,如何更改它的水平位置呢? <div st ...
- (转) JAVA中如何设置图片(图标)自适应Jlable等组件的大小
一.问题: 一个程序,组件上设置某个图片作为图标,因为的label(应该说是组件)已经设定了固定大小, 所以再打开一些大图片时,超过组件大小的部分没显示出来,而小图片又没填充完整个组件 二.解决这个问 ...
- CSS设置图片垂直居中的方法
如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...
- CSS设置图片居中的方法
如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...
- css设置图片水平及垂直居中
.box { /*非IE的主流浏览器识别的垂直居中的方法*/ display: table-cell; vertical-align:middle; /*设置水平居中*/ text-align:cen ...
- 关于HTML+CSS设置图片居中的方法
有的时候我们会遇到这样一个问题,就是当我们按下F12进行使用firebug调试的时候,我们发现图像没有居中,页面底下有横向的滑动条出现,图片没能够居中,默认状态下只是紧靠在页面最左侧,而我们对图像缩小 ...
- css设置图片的透明度
在图片的属性中加上{filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;} opacity是 ...
- css设置图片百分比显示,最简洁的代码
css代码: .img-box { padding-bottom: 100%; } .img-box img { position: absolute; top:; bottom:; left:; r ...
- css设置图片的高等于图片的高
<div class="box"> <img src="img/2222.jpg" /> </div> .box { pos ...
随机推荐
- 矩池云上如何快速安装tensorRT
国内镜像 https://mirrors.cloud.tencent.com/nvidia-machine-learning/ubuntu1804/x86_64/ 检查系统版本 source /etc ...
- JS类型判断&原型链
JS类型检测主要有四种 1.typeof Obj 2.L instanceof R 3.Object.prototype.toString.call/apply(); 4.Obj.constructo ...
- Java的jmap命令使用详解
jmap命令简介 jmap(Java Virtual Machine Memory Map)是JDK提供的一个可以生成Java虚拟机的堆转储快照dump文件的命令行工具.除此以外,jmap命令还可以查 ...
- java 和groovy的混合使用
在应用中,我们可以在一个Java类.一个Groovy类或者一个Groovy脚本中实现某个特定功能.之后可以在Java类.Groovy类或Groovy脚本中调用该功能. 在groovy 使用groovy ...
- Java案例——冒泡排序
排序:将一组数据按照固定的规则进行排列 冒泡排序:一种排序方式,对将要排序的相邻的数据进行两两比较,将较大的放在后面,依次对所有的数据进行操作,直到所有的数据按要求完成排序 冒泡排序原理: 1.如果有 ...
- python 模块之 selenium 自动化使用教程
一.安装 pip install Selenium 二.初始化浏览器 Chrome 是初始化谷歌浏览器 Firefox 是初始化火狐浏览器 Edge 是初始化IE浏览器 PhantomJS 是一个无界 ...
- xx局点FusionCloud6.3 type1 计算配额失败问题
现象: 排查过程: 1.登录云平台部署面,选择部署资源-服务器 2.找到MOC-ManageOne-Service01.MOC-ManageOne-Service02两台机器ip地址. 3.用ssh工 ...
- 盘点几种DIY加密狗的制作方法,适用于穿越机模拟器
前言 前几天笔者的加密狗在使用中突然坏掉了,现象是插电脑不识别,LED灯不亮. 网上很多模友也反映了同样的问题: http://bbs.5imx.com/forum.php?mod=viewthrea ...
- luoguP4859 已经没有什么好害怕的了(二项式反演)
luoguP4859 已经没有什么好害怕的了(二项式反演) 祭奠天国的bzoj. luogu 题解时间 先特判 $ n - k $ 为奇数无解. 为了方便下记 $ m = ( n + k ) / 2 ...
- uoj310【UNR #2】黎明前的巧克力(FWT)
uoj310[UNR #2]黎明前的巧克力(FWT) uoj 题解时间 对非零项极少的FWT的优化. 首先有个十分好想的DP: $ f[i][j] $ 表示考虑了前 $ i $ 个且异或和为 $ j ...