免费学习网考试资料计算机类内容页

CSS居中浮动元素的使用方法

2021-09-12 15:48:58 计算机类

  CSS居中浮动元素的使用方法

  导语:Css功能越来越完美,现在已经能做出各种各样的.样式,其中居中浮动也是Css知识点中的一个。以下是小编为大家搜集的CSS居中浮动元素的使用方法,供大家参考。

  方法一

  设置容器的浮动方式为绝对定位

  然后确定容器的宽高 比如宽500 高 300 的层

  然后设置层的外边距

  CSS Code复制内容到剪贴板

  div

  width:500px;

  height:300px;

  margin:-150px 0 0 -250px;

  position:absolute;

  left:50%;

  top:50%;

  background-color:#000;

  方法二

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

  CSS Code复制内容到剪贴板

  Test Float Element Center

猜你可能喜欢