使用了绝对定位如何居中

最新推荐文章于 2023-04-12 14:31:51 发布

原创最新推荐文章于 2023-04-12 14:31:51 发布 · 679 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css3

前端同时被 2 个专栏收录

26 篇文章

订阅专栏

5 篇文章

订阅专栏

本文介绍了一种使用CSS的绝对定位使元素居中的方法，通过设置left, top属性为50%，并结合transform: translate(-50%, -50%)实现精确居中。这种方法广泛应用于网页布局中，特别是在响应式设计和主题列表展示时。


	//left: 50%;
	//top: 50%;
  	//transform: translate(-50%, -50%);
  	//这三个是使用绝对定位后使其居中的解决方法
.sp-wrap-img.theme-list .yishouwan {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 130px;
  height: 100px;
  z-index: 999;
  opacity: 0.5;
}