CSS实现垂直居中的5种方法（2）
作者：糖伴西红柿 来源：前端观察 发布时间：2009-03-04 12:53:00
标签：垂直居中,方法,css,浏览器
方法二：
这个方法使用绝对定位的 div，把它的 top 设置为 50％，top margin 设置为负的 content 高度。这意味着对象必须在 CSS 中指定固定的高度。
因为有固定高度，或许你想给 content 指定 overflow:auto，这样如果 content 太多的话，就会出现滚动条，以免content 溢出。
<div class="content"> Content goes here</div>
#content { position:absolute; top:50％; height:240px; margin-top:-120px; /* negative half of the height */}
优点：
适用于所有浏览器
不需要嵌套标签
缺点：
没有足够空间时，content 会消失(类似div 在 body 内，当用户缩小浏览器窗口，滚动条不出现的情况)
0
投稿猜你喜欢
- 用Dreamweaver制作网页时，如果插入的图片、GIF动画、声音、视频或链接的网页是用中文命名的，在用IE浏览器浏览时可能显示不出来。以
- 为什么使用事务 当对多个表进行更新的时候，某条执行失败。为了保持数据的完整性，需要使用事务回滚。 显示设置事务 代码如下:beg
new fun的执行过程分析，学习面向对象的朋友可以参考下。（1）创建一个新的对象，并让this指针指向它；（2）将函数的prototype- 新手，看到很多网页上有显示/隐藏的菜单，可以显示隐藏层的同时控制FLASH的播放与停止。找了好久都找不到这个功能。。。还望高人指点当点击时就
- 今天来说说鄙人对input输入框在处理上的细节处理和心得，其实制作一个符合CSS标准、FF/IE7/IE6等主流浏览器全兼容、符合用户体验的
- 给浏览器绑定事件有时候是非常痛苦的事情，不同的浏览器提供不尽相同的功能的同时，也提供了不同的事件。例如，IE 系列的浏览器支持 mousee
- 我发现有的网站利用了SQL SERVER提供的通过EXCHANGE或OUTLOOK收发邮件的扩展存储过程来完成收发和自动处理邮件（这句话太长
- 本文中介绍的系统优化，主要针对前端和后台这两方面（后台方面主要对SQL语句和数据存储进行了优化），下文中我们将介绍一些优化技巧和经验。技巧：
- 最近被“模块化”缠身，又是文章又是PPT的，被逼着想了很多相关的东西。整理下我这段时间对于“模块化”的思考，大多都是我自己从事页面重构这份工
- 毫无疑问，Google是当今世界上最成功的互联网公司之一，但是Google也曾推出过一些失败的实验品。还记得Google Accelerat
- 基本的网站页面设计元素布局比例统计，给大家做个参考，看看您的网站是否和下面的统计一致：标志图案：位置统计结果左上角84％右上角6％上方居中6
- 这份代码不是那种时间没有改变也输出innerHTML的高消耗代码。innerHTML和style的改变是非常消耗游览器性能的，如果你将来希望
- 译序：本文提到了一种很不错的实现跨浏览器圆角的解决方案，但是说的不够全面，前端观察最近将整理更多更全面的资源给大家，敬请期待。前一段时间，我
- 作者：Lachlan Hunt概要网络是不断的进化的. 新的和有创意的网站每天都在出现, 从各方面都在冲击着HTML的边界. HTML 4来
- php遍历目录和文件的场景在很多时候都能用到，遍历目录方法的方法有好几种，那么应该使用
- asp如何用Jmail的发送电子邮件？asp源码见下：<％ Set mail1
- 交互设计师的一项重要工作就是进行产品原型设计(Prototype Design)。而产品原型设计最基础的工作，就是画出站点的大体wirefr
- 1、使用索引来更快地遍历表。缺省情况下建立的索引是非群集索引，但有时它并不是最佳的。在非群集索引下，数据在物理上随机存放在数据页上。合理的索
- 上一篇的DOCTYPE声明好以后，接下来的代码是：<html xmlns="xhtml" ta
- 杭州最美的季节里，淘宝无障碍访问改善小组有幸邀请到盲人在线站长——争渡读屏团队成员——杨永全同学和我们一起面对面交流网站无障碍访问方面的问题
