CSS 将比例尺转换为背景图像

标签 css background-image transform scale

我有心爱的 CSS 部分来影响图像

.split-banner .right-cl:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

我需要将上面的 CSS 应用到 div 元素中包含的背景图像 我怎样才能做到这一点?

最佳答案

悬停时更改背景大小。要模仿 scale(1.1),请使用 110%

div {
  width: 560px;
  height: 400px;
  background: url('http://kenwheeler.github.io/slick/img/fonz1.png') center center no-repeat;
}
div:hover {
  background-size: 110%;
}
<div></div>

关于CSS 将比例尺转换为背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42616579/

相关文章:

html - 使列表元素出现在同级悬停上

css - 在 CSS 中为背景图像指定图像尺寸的正确方法是什么?

css - div类中的背景图像不会拉伸(stretch)到浏览器的全宽

html - IE 8 中的坏像素背景图像

css - Translate3d 不会移动 Safari 中的嵌入元素(仅限 Windows)

html - 我可以设计这个音频播放器吗?

html - 如何使用只有直接 child 的第 nth-child?

mysql 如果第一个记录不存在则回退到另一条记录

javascript - 避免使用 svg 图像进行光栅化,以便在 Firefox 中进行转换

c++ - boost::transform_iterator 和 boost::bind