返回列表 发帖

css居中--padding填充

利用 padding 和 background-clip 配合实现div的水平垂直居中:
通过 background-clip 设置为 content-box, 将背景裁剪到内容区外沿,再利用 padding 设为外 div 减去内 div 的差的一半,来实现:
实例
.children {

width: 100px;

height: 100px;

padding: 50px;

background-color: black;

background-clip:content-box;/*居中的关键*/


尝试一下 »
效果如下所示:

微信截图_20201112101718

提示:关于 padding 的使用,你可以参考 CSS padding 属性部分。

hacks, hacks(小技巧)
有许多 hacks ,负 margin,影子元素 : : before 等。如果你的内容不是固定大小的话,它们大部分是很脆弱的。

返回列表