Question

当我尝试这个时，没有颜色或图像出现：

 #example1 {
    background:blue:
    background: url(tin.jpg) repeat-y;
    background-size: 50% auto;
    width: 100%;
    height:400px;
    padding: 15px;
}

Answer 1

您应该只有一个background定义。目前，您的第二个background会覆盖第一个。{/ p>

＆＃13;

#example1 {
    background: blue url(https://placehold.it/800x800) repeat-y;
    background-size: 50% auto;
    width: 100%;
    height:400px;
    padding: 15px;
}

＆＃13;

<div id="example1">

</div>

＆＃13;

Answer 2

你必须像下面这样结合它。

 background:blue url(http://photos.state.gov/libraries/media/788/images/500x500-sample.jpg) repeat-y;

或者如果你想单独给出，你必须给它像

background-color:blue;
background-image:url(http://photos.state.gov/libraries/media/788/images/500x500-sample.jpg);
background-repeat:repeat-y;

 #example1 {   
   background:blue url(http://photos.state.gov/libraries/media/788/images/500x500-sample.jpg) repeat-y;
    background-size: 50% auto;
    width: 100%;
    height:500px;
    padding: 15px;
}

<div id="example1">

</div>

Answer 3

您只需将您的彩色背景包含在图像背景中，如下所示：

background: blue url(tin.jpg) repeat-y;

所以你的样式代码应该是这样的

#example1 {
  background: blue url(tin.jpg) repeat-y;
  background-size: 50% auto;
  width: 100%;
  height:400px;
  padding: 15px;
}

div有半图像和半色背景吗？

3 个答案: