水平垂直居中图片及文字(兼容IE6+)

Ooo_My_God发表于 分类:css 阅读(3844) 评论(5)

简介:

如何使用css让不固定宽高的div水平垂直居中呢?这个问题似乎有很多解决办法,尝试了网上的最简单且兼容低版本浏览器的方法,但发现存在一些小问题,所以写此文章留存。

1、水平居中

1.1、父容器container添加css属性text-align:center; 子容器center添加css属性display:inline-block;

1.2、代码如下:

2、水平垂直居中

2.1、具体还是看代码吧!

2.2、代码如下:

3、结束语

本文有任何错误,或有任何疑问,欢迎留言说明。

如果觉得我的文章对您有用,请随意打赏。您的支持将是我继续创作的动力! ¥ 打赏支持 ¥

本站文章除注明转载外,均为原创文章,会经常更新知识点以及修正一些错误,因此转载请保留原出处,方便溯源,避免陈旧错误知识的误导,同时有更好的阅读体验。

http://www.ydcss.com/archives/497

相关推荐

评论

回复给XXX取消回复

说点什么吧...

网友最新评论 (5)

  1. 你确定display:table和display:table-cell在IE6 IE7下支持吗???

    肾虚的码农 01-21 10:24 回复
    • 你好,IE6 7下是不支持display: table的。
      可以用*position: absolute; *top: 50%; *left: 50%; /*for ie67*/,具体事例代码里面有哟!

      Ooo_My_God 01-21 15:55
  2. 赞~\(≧▽≦)/~

    疯子_进行式 06-13 15:43 回复
  3. 水平垂直居中:.container{position:relative;width:500px;height:300px;}.center{position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;}

    王恒 12-28 16:17 回复
输入关键字