css学习笔记:DIV水平垂直居中
作者:好好 来源:好好blog 时间:2009-06-19 12:45:00
无意中看到以前在电脑上保存的一个html页面,关于div水平垂直居中的问题。
如何实现div水平垂直居中呢?
1.已知宽高度水平垂直居中
position:absolute;top:50%;left:50%:将div的左上角水平垂直居中了。在用:margin-top:-(height/2);margin-left:-(width/2) 调整位置达到居中。
源码:
2.未知高度div水平垂直居中
在一篇贴子中解释到:
标准浏览器中(FF,Opera, Safari等):可将父级元素显示方式设定为TABLE(display: table;) ,内部子元素定为table-cell (display: table-cell),通过vertical-align特性使其垂直居中,但非标准浏览器是不支持的。
非标准浏览器中:只能在子元素里设距顶部50%,里面再套个元素距顶部-50%来抵消。
源码:
标签:css,web2.0,垂直,居中,前端开发
0
投稿
猜你喜欢
asp中的rs.open于conn.execute的区别
2009-10-29 12:12:00
教你制作IBM LOGO的方法
2007-10-23 13:34:00
Web Design广告字体设计技巧
2010-06-24 21:52:00
Oracle 存储过程总结 二、字符串处理相关函数
2009-07-07 10:28:00
MYSQL数据库表设计与优化(一)
2010-10-25 19:50:00
AJAX打造博客无刷新搜索
2007-08-23 08:48:00
如何动态产生变量?
2009-11-18 16:33:00
对“关于购物车的想法”的一些回复
2009-03-10 18:15:00
sql server如何得到插入一条记录后最新的ID?
2009-11-15 20:06:00
SQL 比较一个集合是否在另一个集合里存在的方法分享
2011-12-01 10:19:26
MySQL 5.0.16的乱码问题解决方法
2011-12-14 18:33:24
CSS资料中常见英语词语翻译整理
2008-08-29 12:50:00
Yahoo! BrowserPlus 介绍
2008-06-01 16:38:00
Server 对象 错误 ASP 0177 800401f3 的解决方案 Server 对象 错误 ASP 0177 800401f3
2009-07-28 17:57:00
如何正确的解决 MySQL中忽略用户的现象
2008-11-27 16:00:00
各个版本IE合集下载,共存无冲突
2007-11-29 13:12:00
40个网页设计常用小代码
2008-01-01 19:27:00
大内存SQL Server数据库的加速剂
2009-03-06 14:18:00
960 时代的终结
2011-01-11 19:24:00
DIV+CSS常见错误及解决方法
2008-04-25 22:46:00