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

本文介绍了CSS将比例转换为背景图像的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我很喜欢CSS部件来生成图像

I have beloved CSS part effecting for a image

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

我需要将以上CSS应用于div元素中包含的背景图像我该怎么办?

I need to apply above CSS to background image contain in a div elementHow can I do that?

推荐答案

在悬停时更改background-size.要模拟scale(1.1)，请使用110%.

Change background-size on hover. To mimic scale(1.1) use 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将比例转换为背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！