html - 渐变颜色的背景图片在Chrome中不起作用

我正在尝试将webkit渐变标签与用于Chrome的图片一起使用，渐变颜色有效，但图片未在chrome中显示。我已经在Firefox中进行了尝试，并且图像和渐变颜色效果很好。

background: linear-gradient(to bottom, rgb(74,40,73,.8),
rgb(147,98,143,.8)), url(./images/covers/1.jpg) no-repeat;

.profile-card {

	background: linear-gradient(to bottom, rgba(74,40,73,.8), rgb(147,98,143,.8)), url(./images/covers/1.jpg) no-repeat;

	background: -webkit-linear-gradient(bottom, #4A2849, #93628F), url(./images/covers/1.jpg) no-repeat;  /* image not working in chrome */
	background-size: cover;
	width: 100%;
	min-height: 90px;
	border-radius: 4px;
	color: #fff;

  }

<div class="profile-card">
          <img src="images/users/user-1.jpg" alt="user" class="profile-photo">
          <h5><a href="#" class="text-white">abc
        </div><!--profile ends-->

但是在chrome中，我尝试使用此代码

background: -webkit-linear-gradient(bottom, #4A2849, #93628F),
url(./images/covers/1.jpg) no-repeat;

但图片未在Chrome中显示。

最佳答案

使用rgba代替rgb，例如：

.a { background: linear-gradient(to bottom, rgba(74,40,73,.8),
rgba(147,98,143,.8)), url(./images/covers/1.jpg) no-repeat;
}

.b {
background: -webkit-linear-gradient(bottom, #4A2849, #93628F),
url(./images/covers/1.jpg) no-repeat;
}

<div class="a">A</div>
<div class="b">B</div>