小编Ser*_*giu的帖子

如何修复悬停时 CSS 变换添加的白线?

有人找到或知道针对悬停时使用 CSS 缩放进行转换的元素上出现的白线/边框的有效修复吗?

我尝试过以下方法:transform: translateZ(0)-webkit-backface-visibility: hidden、 ,transform-style: preserve-3d但没有任何帮助。

在非视网膜显示器上可以清楚地看到这个错误。

这是为那些看不到该错误的人提供的视频,您会注意到图像底部有一条类似 1px 的线。

section {
  padding: 100px 0;
}

figure {
  margin: 0;
  overflow: hidden;
}

figure:before {
  position: absolute;
  z-index: 2;
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(43, 43, 54, 0.3);
  transition: background 0.7s cubic-bezier(0.2, 1, 0.2, 1);
}

.ct-image-container {
  display: flex;
  position: relative;
  transform: scale3d(1, 1, 1);
  transition: transform 0.7s cubic-bezier(0.2, 1, 0.2, 1);
}

.ct-image-container img {
  position: …
Run Code Online (Sandbox Code Playgroud)

css transform line scale hover

5
推荐指数
1
解决办法
2335
查看次数

标签 统计

css ×1

hover ×1

line ×1

scale ×1

transform ×1