使用了绝对定位如何居中

最新推荐文章于 2023-11-03 09:55:46 发布

Zan^Z

最新推荐文章于 2023-11-03 09:55:46 发布

阅读量640

点赞数

分类专栏：前端 H5 文章标签： css3

本文链接：https://blog.youkuaiyun.com/Zan_Z/article/details/106090478

版权

前端同时被 2 个专栏收录

26 篇文章

订阅专栏

5 篇文章

订阅专栏

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

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >


	//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;
}