让图片在DIV中垂直居中
window.onload=function(){
var img = document.getElementById("imgdiv");
var div = document.getElementById("div1");
var marginTop = div.offsetHeight - img.height;
img.style.marginTop = (marginTop/2) + "px";
}
让图片在DIV中垂直居中的更多相关文章
- 尺寸不固定的图片在div中垂直居中并完全显示
前几天做一个项目,需要批量上传图片,图片外侧div尺寸固定:由于图片是用户输入的,所以大小存在不确定性,产品需求是无论图片尺寸多大,都要垂直居中完全显示 废话不多说,直接上代码 html <ul ...
- CSS-布局【1】-图片在div中垂直居中
方法一:通过增加100%高度行内块居中对齐 <!DOCTYPE html> <html> <head> <meta name="viewport&q ...
- 单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中
单个未知大小图片在div里面垂直居中的方法...添加辅助元素挤一下位置达到居中 <div class="ServicesLiTopPic"> <i>&l ...
- 设置span在div中垂直居中
转自:https://blog.csdn.net/weirenkuan/article/details/51177695 使用display:table-cell,span中内容无论多少,都可以垂直居 ...
- 未知行数的文字在div中垂直居中
今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,ht ...
- 随机图片大小在DIV中垂直居中对齐总结
老遇到这种样式 现在总结一下 <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type&quo ...
- 让图片在div 中居中的方法
方法一: 思路:利用text-align属性将图片水平居中,然后设置padding-top的值使其垂直居中. 结构如下: <div> <img src="images/tt ...
- 未知高度的图片在div设置垂直居中
方法一: 该方法是将外部容器的显示模式设置成display:table,img标签外部再嵌套一个span标签,并设置span的显示模式为display:table-cell,这样就可以很方便的使用ve ...
- 不定宽高的文字在div中垂直居中
本人在面试的时候被问到:如何使一段不定宽高的文字垂直居中呢? 现在来总结一下: 在body中写入结构 <div id="main"> <div id=&qu ...
随机推荐
- [topcoder]CorrectMultiplicationTwo
http://community.topcoder.com/stat?c=problem_statement&pm=11609&rd=14547 http://apps.topcode ...
- 为什么手机连接wifi会显示已停用?
1.通常导致手机连接WiFi显示“已停用”故障的原因是由于无线路由器“安全模式”设置不当造成的,对此我们可以通过以下方法来解决: 2.根据无线路由器背面的信息(包括路由器IP地址,登陆用户名和密码), ...
- spring集成Apache的ActiveMQ
1.直接看优秀的博客 http://www.open-open.com/lib/view/open1435496659794.html
- 【HDOJ】3436 Queue-jumpers
离散化+伸展树. /* 3436 */ #include <iostream> #include <string> #include <map> #include ...
- 【CF】142 Div.1 B. Planes
SPFA.注意状态转移条件,ans的求解需要在bfs中间求解.因为只要到了地点n,则无需等待其他tourist.还是蛮简单的,注意细节. /* 229B */ #include <iostrea ...
- 12篇学通C#网络编程
转自:http://www.cnblogs.com/huangxincheng/archive/2012/01/03/2310779.html 在C#的网络编程中,进程和线程是必备的基础知识,同时也是 ...
- (转载)php循环检测目录是否存在并创建(循环创建目录)
(转载)http://www.jb51.net/article/25917.htm php循环检测目录是否存在并创建,需要的朋友可以参考下. 循环创建目录方法 这个会生成image.gif目录 代码如 ...
- HDU-2975 Billboard
Billboard Time Limit : 20000/8000ms (Java/Other) Memory Limit : 32768/32768K (Java/Other) Total Su ...
- linux vi快捷键大全
h或^h 向左移一个字符 j或^j或^n 向下移一行 k或^p 向上移一行 l或空格 向右移一个字符 G 移到文件的最后一行 nG 移到文件的第n行 w 移到下一个字的开头 W 移到下一个字的开头,忽 ...
- Linux下SVN命令总结
目录 一.从版本库获取信息... 1 二.从版本库到本地... 2 三.从本地到版本库... 2 四.高级应用... 4 一.从版本库获取信息 svn help command 获取子命令说明 svn ...