我在我的网站上制作了一张引导卡,我想让它水平。 我想将其转换为.
请通过检查我的代码提供解决方案!
.blue-bg{
background-image: linear-gradient(#1385de,#045f9b);
color: white;
}
.brown-bg{
background-image: linear-gradient(#f8b949,#f7951f);
}
.order-btn2{
background-image: linear-gradient(#ffde5e,#fdd215);
color: black;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<li class="card col-sm-3">
<img class="card-img-top" src="https://i.ibb.co/Tcn9qV7/phoneSms.png" alt="Card image">
<div class="card-header brown-bg">
SMS Order
</div>
<div class="card-body blue-bg p-0 mt-1">
<p class="card-text">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit.</p>
<a href="#" class="btn btn-primary order-btn2">Place Order</a>
</div>
</li>
谢谢。