如何使用CSS居中浮动元素

本篇内容主要讲解“如何使用CSS居中浮动元素”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“如何使用CSS居中浮动元素”吧!

目前创新互联建站已为成百上千的企业提供了网站建设、域名、虚拟空间、网站托管、服务器托管、企业网站设计、钦州网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

方法一

设置容器的浮动方式为绝对定位
然后确定容器的宽高 比如宽500 高 300 的层
然后设置层的外边距

CSS Code复制内容到剪贴板

1.  div{   

2.         width:500px;   

3.         height:300px;   

4.         margin:-150px 0 0 -250px;   

5.         position:absolute;   

6.         left:50%;   

7.         top:50%;   

8.         background-color:#000;   

9. }  

方法二

父元素和子元素同时左浮动，然后父元素相对左移动50%，再然后子元素相对右移动50%，或者子元素相对左移动-50%也就可以了。

CSS Code复制内容到剪贴板

1.   

2.        

3.        

4.        

5.         .p{   

6.             position:relative;   

7.             left:50%;   

8.             float:left;   

9.         }   

10.         .c{   

11.             position:relative;   

12.             float:left;   

13.             rightright:50%;   

14.         }   

15.        

16.        

17.         Test Float Element Center   

18.