简易处理图片在div中居中铺满
原文地址:http://www.cnblogs.com/JimmyBright/p/7681089.html
经常需要在一个长宽固定的div里存放一个图片,这个图片长宽未知,所以需要图片自适应div显示
.imgBox img {
max-width: 100%;
max-height: 100%;
/* min-width: 195px; */
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
imgBox 是一个长宽固定的div,如下样式
.imgBox {
/* width: 195px;
height: 195px; */
background: transparent;
position: relative;
left:;
top:;
border: 1px solid rgba(0, 0, 0, 0.2);
}
简易处理图片在div中居中铺满的更多相关文章
- 如何使一个div能够铺满整个页面? && 模态框的制作 && outerHTML
说明: 使用 ele.outerHTML = '' 这样的方法可以很容易的清除一个元素. 当然也可以使用parent.removeChild() ,但是相较而言,还是使用 outerHTML = '' ...
- 转载 html div三列布局占满全屏(左右两列定宽或者百分比、中间自动适应,div在父div中居底)
原文地址:http://blog.csdn.net/duyelang/article/details/20558899 <p><!DOCTYPE html> <html ...
- 如何将div高度填满剩余高度
下列代码中navbar高度为30px,content高度需要填满浏览器的剩余高度 <div id="body"> <div id="navbar ...
- 实现左边div固定宽度,右边div自适应撑满剩下的宽度的布局方式:
html: <div class="container"> <div class="left"> left固定宽度200px </ ...
- 两个DIV,左DIV宽度固定,右DIV自动填满剩余空间
<style type="text/css"> #main{ width:98%; } #sidebar{ float:left; width:200px; backg ...
- css实现左边div固定宽度,右边div自适应撑满剩下的宽度
(1)使用float <div class="use-float"> <div></div> <div></div> & ...
- 左边div固定宽度,右边div自适应撑满剩下的宽度--实现方法汇总
神奇的事 其实有的方法(float.position.margin.flex)是有border像素的差 代码如下: <!DOCTYPE html><html><head ...
- 控制DIV占满屏幕
网上找了很多帖子,希望是CSS控制的,但是在bootstrap环境下, 控制方式上有点问题.达不到想要的效果. 项目中需要实现的效果: DIV区域占满当前窗口的高度.且在ctrl+鼠标滚轮调整窗口大小 ...
- JS组件系列——图片切换特效:简易抽奖系统
前言:前两天在网上找组件,无意中发现了我们儿时游戏机效果的“SlotMachine组件”,浏览一遍下来,勾起了博主小时候满满的回忆.于是下定决定要研究下这么一个东西,不得不再次叹息开源社区的强大,原来 ...
随机推荐
- python 字典,元组,对象,数组取值方法
def create(self,cr,uid,vals,context=None): if context is None: context ={} if vals.get('name','/')== ...
- jquery訪问ashx文件演示样例
.ashx 文件用于写web handler的..ashx文件与.aspx文件类似,能够通过它来调用HttpHandler类,它免去了普通.aspx页面的控件解析以及页面处理的过程.事实上就是带HTM ...
- Regionserver启动后又关闭
今天启动hbase shell,输入hbase命令时报错: ERROR [regionserver/regionserver1/172.18.0.61:16020] reggionserver.HRe ...
- 20155207 《网络对抗技术》EXP3 免杀原理与实践
20155207 <网络对抗技术>EXP3 免杀原理与实践 基础问题回答 杀软是如何检测出恶意代码的? - 根据特征码进行检测(静态) - 启发式(模糊特征点.行为 ) - 根据行为进行检 ...
- 2017-2018-2 20155230《网络对抗技术》实验9:Web安全基础
实践过程记录 下载wegot并配置好java环境后 输入java -jar webgoat-container-7.0-SNAPSHOT-war-exec.jar 在浏览器输入localhost:80 ...
- 20155333 《网络对抗》Exp2 后门原理与实践
20155333 <网络对抗>Exp2 后门原理与实践 1.例举你能想到的一个后门进入到你系统中的可能方式? 下载的软件中捆绑有后门: 浏览的网页或其上的小广告: 有些网页会自动安装软件. ...
- Luogu P3370 【模板】字符串哈希
方法很多,hash,双hash(个人想到一种三hash),挂链,还有STL: map 乱搞 CODE #include<iostream> #include<map> #inc ...
- 汇编 EBP ,ESP 寄存器
知识点: CALL框架 EBP寄存器 栈底指针 ESP寄存器 栈顶指针 一.EBP栈底指针 EBP是一个特殊的寄存器,通过EBP+偏移量 可以访问CALL里边的局部变量.它的低16位叫BP ...
- ILSVRC2016目标检测任务回顾——视频目标检测(VID)
转自知乎<深度学习大讲堂> 雷锋网(公众号:雷锋网)按:本文作者王斌,中科院计算所前瞻研究实验室跨媒体计算组博士生,导师张勇东研究员.2016年在唐胜副研究员的带领下,作为计算所MCG-I ...
- Page结构
SQL Server存储数据的基本单元是Page,每一个Page的大小是8KB,数据文件是由Page构成的.在同一个数据库上,每一个Page都有一个唯一的资源标识,标识符由三部分组成:db_id,fi ...