angular - 如何在 ionic 中响应图像？

Question

我正在创建一个 ionic 应用程序，因为我需要在我的主页中添加背景图片。图片大小为1280*698。

我试过下面的代码，

CSS:

#homecontent {
  background-image: url('../img/home2.png') !important;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
}

HTML:

<ion-content id="homecontent"></ion-content>

我的问题是，背景图像没有响应。我该怎么做？

Answer 1

你可以使用:

#homecontent{
    background:url('../img/home2.png');
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
}

如果你想保持背景图片的宽高比或者:

#homecontent{
    background:url('../img/home2.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
}

如果你的背景图像应该在高度和宽度上缩放 oth

http://www.w3schools.com/cssref/css3_pr_background-size.asp和 http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-size&preval=contain