使用div+css实现背景颜色渐变,怎么实现呢?

 我来答
百度网友4d9ef58
推荐于2017-10-13 · TA获得超过690个赞
知道答主
回答量:258
采纳率:75%
帮助的人:94.5万
展开全部

利用css3可实现背景颜色渐变:

一、线性渐变:

    1、线性渐变在 Mozilla 下的应用

  语法:

     -moz-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* )

  2、线性渐变在 Webkit 下的应用

  语法: 

-webkit-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* )//最新发布书写语法

3、线性渐变在 Opera 下的应用

  语法:

-o-linear-gradient([<point> || <angle>,]? <stop>, <stop> [, <stop>]); /* Opera 11.10+ */

二 径向渐变

  语法:

-moz-radial-gradient([<bg-position> || <angle>,]? [<shape> || <size>,]? <color-stop>, <color-stop>[, <color-stop>]*);

 -webkit-radial-gradient([<bg-position> || <angle>,]? [<shape> || <size>,]? <color-stop>, <color-stop>[, <color-stop>]*);

   

  

   

百度网友76b68dd
推荐于2017-09-12 · TA获得超过1130个赞
知道小有建树答主
回答量:480
采纳率:66%
帮助的人:309万
展开全部

如果只要求兼容高级浏览器,CSS3可以解决。

<div class="box"></div>
.box{width:500px;height:100px;background-image: -moz-linear-gradient(top , #45B5DA, #0382AD);background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#45B5DA), to(#0382AD));background-image: -o-linear-gradient(top , #45B5DA, #0382AD);}

如果要兼容低级浏览器,例如IE6,还是用背景图片重复吧。

上面的这属性可以在CSS手册里查到。

本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式