css篇之absolute绝对定位元素居中技巧

来源：动视网责编：小采时间：2020-11-27 18:53:18

css篇之absolute绝对定位元素居中技巧

css篇之absolute绝对定位元素居中技巧:一般地，居中绝对定位元素，left:50%;top:50%;再margin负值或者通过transform也可达到效果。今天发现另一个技巧，利用，top,left,right,bottom取值0，再magin:auto,即可实现居中。原因：<div class='box> <div

推荐度：

点击下载本文 文档为doc格式

导读css篇之absolute绝对定位元素居中技巧:一般地，居中绝对定位元素，left:50%;top:50%;再margin负值或者通过transform也可达到效果。今天发现另一个技巧，利用，top,left,right,bottom取值0，再magin:auto,即可实现居中。原因：<div class='box> <div

一般地，居中绝对定位元素，left:50%;top:50%;再margin负值或者通过transform也可达到效果。
今天发现另一个技巧，利用，top,left,right,bottom取值0，再magin:auto,即可实现居中。
原因：

<div class='box>
 <div class='jz'></div>
</div>

div.box{
 position: relative;
 height: 300px;
 background: #989eaa;
}
div.fz{
 width: 100px;
 height: 100px;
 background: #499682;
 position: absolute;
 top:0;
 left: 0;
 right: 0;
 bottom: 0;
 margin:auto;
}

更多css篇之absolute绝对定位元素居中技巧相关文章请关注PHP中文网！

css篇之absolute绝对定位元素居中技巧

推荐度：

点击下载本文 文档为doc格式

标签：技巧居中 css

热门焦点

css篇之absolute绝对定位元素居中技巧

css篇之absolute绝对定位元素居中技巧

css篇之absolute绝对定位元素居中技巧

最新推荐

猜你喜欢

热门推荐