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 ...
随机推荐
- 专业3 Cookie 和Session的使用及原理
Cookie的使用及原理 什么是cookie cookie是一种用来跟踪和识别用户上网信息的会话控制技术,它将跟踪后的信息存储在客户端的浏览器上 cookie如何使用 第一步:设置cookie即可(告 ...
- tp5 (自写) 实现redis消息队列 + 排行榜
1:小皮开启redis, 控制器按Ctrl 点击new Redis 进入 redis.php 进行封装 //向队列添加数据 // LPUSH key value1 [value2] //将一个或多个值 ...
- Applied Social Network Analysis in Python 相关笔记3
如果是option2的话,答案选A. 这里节点s,从左边的选择,节点t从右边选择. 这里计算还是用以前的值,不用更新过的值.
- CF1106F题解
居然没人写常系数齐次线性递推/jy 题意明确. 首先我们注意到这个系数是在幂上面的,这道题的各种信息都是建立在乘法上的,十分不好处理,考虑求一个 \(\ln\) 将这些信息建立在加法上. \[\ln ...
- AT1219题解
题意 设 \(a\) 的价值为 \(a \times cnt_a\)(\(cnt_a\) 为 \(a\) 在区间中出现的次数),求区间种某种元素,使得这种元素的价值最大. 因为设计出现元素的次数,所以 ...
- Python 基础知识自检,离深入掌握 Python 还有多远
1. 模块化编程思想 模块化编程是 Python 的基本思想.初学 Python,都应该使用过小海龟.随机.数学模块.使用模块之前,需要导入模块,然后根据自己的问题需要使用这些模块. Python 提 ...
- ActiveX 是什么,和IE什么关系
在推出25年多以后,IE浏览器终于要退役了. 据外媒报道,微软决定自2022年6月15日起,让IE浏览器彻底退出互联网舞台,并全面改用Microsoft Edge浏览器. 关于IE的历史可以参考这篇文 ...
- 【KiCad镜像】下载与安装
镜像下载.域名解析.时间同步请点击 阿里云开源镜像站 一.KiCad介绍 KiCad EDA 是一款用于印刷电路板设计的开源自由软件,基于 GPLv3 开源协议. 软件包含工程项目管理.原理图设计.线 ...
- 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. ...
- maltego的基本使用
首次使用maltego需要注册 注册网站:https://www.paterva.com/web7/buy/maltego-clients/maltego-ce.php 填写好点注册就行了 1. 打开 ...