网站推广软文是什么,建筑网站图片,维护网站都干什么,优秀设计网站点评此方式可以实现背景色由上往下渐变,这里加上-webkit-考虑兼容问题#xff0c;若要改变渐变方向#xff0c;改变top即可#xff0c;如right、left、bottom效果图#xff1a; 代码如下#xff1a; background: -webkit-linear-gradient(top,red,black); 不带前缀#xff0c… 此方式可以实现背景色由上往下渐变,这里加上-webkit-考虑兼容问题若要改变渐变方向改变top即可如right、left、bottom效果图 代码如下 background: -webkit-linear-gradient(top,red,black); 不带前缀支持标准兼容的浏览器需将top改为to top渐变方向由下向上效果图 代码如下 background: linear-gradient(to top, red, black); 改变对角线渐变 同时改变水平方向和垂直方向渐变方式如下,渐变方向为右上方→左下方。 效果图: 代码如下 background: -webkit-linear-gradient(top right, red, black); 不带前缀支持标准兼容的浏览器,需将此方式渐变方向为左上方→右下方。 效果图: 代码如下: background: linear-gradient(to bottom right, red,black); 三种颜色过渡: white%80代表白色指定80%的位置 效果图: 代码如下: background: linear-gradient(to bottom, red, white 80%, black); 角度渐变将上述方向替换即可。 to top - 0deg
to right - 90deg
to bottom - 180deg
to left - -90deg(或270deg)
to top left - -45deg(或315deg)
to top right - 45deg
to bottom left - -135deg(或225deg)
to bottom right - 135deg 转载于:https://www.cnblogs.com/dantayihao/p/9330287.html
