绝对定位的div的居中方法，下面的写法兼容IE系列浏览器和火狐浏览器。

详细解说，直接看样式：
#dingwei{padding:10px;background-color:#003300;color:#FFFFFF;
width:600px;height:300px;
display:block;
position: absolute;
top:50%;
left:50%;
margin-left:-300px;
margin-top:-150px;}

padding:10px;background-color:#003300;color:#FFFFFF; 这几句都是装饰性的东西不是核心；

width:600px;height:300px; DIV总的有个宽高吧，根据你的具体情况设置；

display:block; 把DIV以块级元素显示；

position: absolute;top:50%;left:50%;margin-left:-300px; margin-top:-150px; 这一段时重点，我想聪明的朋友都看明白了。
就是绝对定位DIV层，当然你应该让他相对于body标签。margin-left:-300px; 这个值是DIV宽度的一半， margin-top:-150px; 是DIV高度的一半。

我喜欢，驾驭着代码在风驰电掣中创造完美！我喜欢，操纵着代码在随必所欲中体验生活！我喜欢，书写着代码在时代浪潮中完成经典！每一段新的代码在我手中诞生对我来说就象观看刹那花开的感动！

//我看到最后一段话，所以我转载了。

http://www.cnblogs.com/liuling/archive/2012/12/24/dasfafd.html

转载于:https://www.cnblogs.com/devcjq/p/3139922.html

绝对定位的div的居中方法，下面的写法兼容IE系列浏览器和火狐浏览器。相关推荐

元素div 上下左右居中方法总结
元素div 上下左右居中方法总结情景一:一个浏览器页面中,只有一个div模块,让其上下左右居中解决方案: { position:fixed; left:0; right:0; top:0; b ...
js技术要点---document.write()方法在IE浏览器和火狐浏览器下面的兼容性问题
2.js技术要点---document.write("")方法在IE浏览器和火狐浏览器下面的兼容性问题技术qq交流群:JavaDream:251572072 教程下载,在线交流 ...
绝对定位的DIV绝对居中显示
绝对居中:即在客户端上任何分辨率下纵横方向均居中紫色的正方形为绝对定位的div position:absolute; top: 50%; left: 50%; 只能把div定位在以红色圈为起点 ...
绝对定位的div图片居中自适应
需求点固定定位div中添加图片内容,保证图片垂直居中,并且自适应. 一般在第三方UI组件中,这种布局需求较为常见解决方案一 (亲测有效) HTML代码: <div class="e ...
css：子元素div 上下左右居中方法总结
情景一:一个浏览器页面中,只有一个div模块,让其上下左右居中解决方案: { position:fixed; left:0; right:0; top:0; bottom:0; margin:a ...
div上下左右居中方法
方法一:在浏览器中只有一个div的情况 1 { position:fixed; 2 position:fixed; 3 left:0; 4 right:0; 5 top:0; 6 bottom:0; ...
火狐浏览器摄像头权限怎么开启火狐浏览器摄像头权限开启的方法
火狐浏览器是我们大家经常使用的浏览器之一,在使用这款浏览器的过程有时候需要使用到摄像头,那你知道火狐浏览器摄像头权限怎么开启的吗?接下来我们一起往下看看火狐浏览器摄像头权限开启的方法吧. 方法步骤 1 ...
linux firefox严重卡顿,火狐浏览器卡顿怎么办卡顿解决方法一览
Firefox火狐浏览器也是小编感觉非常好用的浏览器,极少出现卡顿的情况,但遇上卡顿的情况也是比较难以解决的,因为造成卡顿的原因比较多,所以解决起来也比较棘手,但是根据Firefox火狐浏览器官网发布 ...
用CSS让DIV上下左右居中的方法
例如一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;).让其上下左右居中. 方法一(varticle-align) 理念利用表格单元格的居中属性. 步骤 ...

绝对定位的div的居中方法，下面的写法兼容IE系列浏览器和火狐浏览器。

绝对定位的div的居中方法，下面的写法兼容IE系列浏览器和火狐浏览器。相关推荐

最新文章

热门文章