如何在基于元素的重新布局中使用图像作为背景?

时间:2017-01-12 15:51:02

标签: css responsive-design responsive-images

我试图在布局的左侧使用一个人的图像。但在较小的屏幕中它看起来很紧张。我试图使用以下背景属性:

background: rgba(0, 0, 0, 0) url("../images/login.png");
background-size: 100% 100%; // i have tried with contain and cover as well
background-repeat: no-repeat;
height: 92%;

4 个答案:

答案 0 :(得分:1)

因为它将在比其res更大的背景上拉伸,移除高度attr可能会显示更好的结果。或者可以根据静态宽度和高度直接设置。

答案 1 :(得分:0)

使用background-size: cover如果您不喜欢其结果,请使用background-size: contain

答案 2 :(得分:0)

使用background-size: contain并移除height: 92%

答案 3 :(得分:0)

您可以尝试:

background-size: auto; background-position: left center;

也许您可以使用https://codepen.io创建一支笔来重建问题。