【问题标题】:Bootstrap with CSS Transition带有 CSS 过渡的引导程序
【发布时间】:2016-10-20 09:01:21
【问题描述】:

嘿,所以我多年来一直试图解决这个问题,并且我一直在寻找解决方案几个小时!并尝试了我在 Stack Overflow 和其他各种网站上遇到的几乎所有内容。

我不确定我的问题是像素舍入、Bootstrap 还是 CSS 过渡。

这似乎是一个常见问题,我的图像网格之间有 1px 的间隙,尤其是在浏览器调整大小时。

网格本身可以完美地工作并且可以很好地缩放,但是我为悬停标题添加了一些代码,这似乎导致了我尝试过的问题。

悬停状态代码位于此处:Image caption Hover animation

这是正在发生的事情的一个工作示例 - Working Example

我尝试添加有人推荐的-webkit-backface-visibility: hidden;,但我完全被难住了,我在 Chrome、Firefox 和 Safari 中遇到了同样的问题。

【问题讨论】:

    标签: twitter-bootstrap google-chrome grid hover css-transitions


    【解决方案1】:

    只需添加

    clip: rect(10px, 10px, 10px, 10px); 进入你的 .hovereffect img

    比添加这个属性和值 -webkit-mask-image: -webkit-radial-gradient(square, white, black); 进入你的.hovereffect

    这应该可行。

    【讨论】:

      猜你喜欢
      • 2014-01-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-12-22
      • 2017-08-20
      • 2015-07-14
      相关资源
      最近更新 更多