css实现图片渐变效果图 |css 数字 滚动效果图

.gradient-img {
position: relative;
}
.gradient {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1));
}

首先，大家需要给图片的父级元素设置position：relative。然后，在父级元素里新建一个div，并将其position设置为absolute，再设置一下宽高即可。在该div中，大家使用CSS3的新特性linear-gradient来实现渐变效果，这里大家设置了渐变色的起点为透明，终点为黑色。如果需要自定义颜色，可以更改颜色值。最后，大家将渐变div添加到图片的父级元素中即可。

代码如下：

字体 斜体 css，哈尔滨前端css教程，css设置标题的方式，css设置浮动到左侧，旅游网站css模板下载，css背景图宽高比例，css 数字 滚动效果图

使用以上代码，便可实现图片渐变效果图。