设为首页  
联系我们  
加入收藏  
网页制作 冲浪宝典 图形图像 操作系统 软件教学 编程开发 认证考试 安全技术 站长专区 文学驿站 娱乐天地 游戏天地 办公软件
文章搜索
您的位置: 首页 >> 文章首页 >> 网页制作 >> CSS >> 用CSS实现图片垂直居中方法
精品推荐
CSS点击TOP10
·常用CSS大全
·HTML样式表CSS属性汇总
·CSS中如何正确的使用 id 和 class
·css 所有属性如何快速记忆
·网页制作小工具大全(下)
·改变IE的字体大小设置时,页面字体不发生改变,怎样实现?
·CSS中文教程
·用CSS控制图片自适应大小的方法
·网页排版CSS教学
·有关表格边框的css语法整理
网页制作点击TOP10
·菜鸟架设动网论坛全教程
·网页模板的使用方法 (教程)
·常用CSS大全
·网页对联广告代码效果大全
·用Dreamweaver简单描述制作网页的基本步骤
·javascript技巧--如何制作移动的浮动层
·用HTML页面中的javascript函数控制Flash动画播放
·天极网软件频道的用JS实现的图片切换特效
·网页初学者的参考:HTML标记手册
·用JavaScript实现文件图片滚动效果
精选专题

用CSS实现图片垂直居中方法

作者: 来源:http://www.xgdown.com/ 时间:2007-8-4 9:18:52

网页制作,用CSS技巧">CSS实现图片垂直居中方法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<style type="text/css">
<!--
body {
 margin:0;padding:0
 }
div {
 width:500px;
 height:500px;
 line-height:500px;
 border:1px solid #ccc;
 overflow:hidden;
 position:relative;
 text-align:center;
 margin:auto
 }
div p {
 position:static;
 +position:absolute;
 top:50%
 }
img {
 position:static;
 +position:relative;
 top:-50%;left:-50%;
 width:276px;
 height:110px;
 vertical-align:middle
 }
p:after {
 content:".";font-size:1px;
 visibility:hidden
 }
-->
</style>

<div><p><img src=" http://www.webjx.com/images/logo.gif"/></p></div>


用CSS实现图片垂直居中方法 相关文章:
用CSS实现图片垂直居中方法 相关软件:
特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
转载请注明来源:http://www.xgdown.com