css 各个方向渐变(从左到右、从上到下、从左上到左下)
从左到右
HTML代码:
<div class="bodyDiv"></div>
css代码:
.bodyDiv {height: 200px;width: 200px;margin: auto;//从左到右background: linear-gradient(to right, #EAE5C9, #6CC6CB);}
实现结果:
从上到下
HTML代码:
<div class="bodyDiv"></div>
css代码:
.bodyDiv {height: 200px;width: 200px;margin: auto;//从上到下background: linear-gradient(to bottom, #CCFBFF, #EF96C5);}
实现结果:
从左上角到右下角
HTML代码:
<div class="bodyDiv"></div>
css代码:
.bodyDiv {height: 200px;width: 200px;margin: auto;//从左上角到右下角background: linear-gradient(to bottom right, #EAD6EE, #A0F1EA);}
实现结果:
如果觉得《css 各个方向渐变(从左到右 从上到下 从左上角到右下角)》对你有帮助,请点赞、收藏,并留下你的观点哦!