CSS实例学习教程:用CSS3绘制网页渐变背景

2024-07-11 09:01:50

字体：大中小

来源：转载

供稿：网友

武林网(www.vevb.com)文章简介：CSS3中绘制渐变背景.

火狐浏览器：
-moz-linear-gradient(起始点, 其实颜色, [中间颜色百分比], 结束颜色)。
起始点：left top center bottom，可以组合。
颜色： ragba，如果是transparent则为透明。
-moz-linear-gradient(center top, transparent, transparent 49%, rgba(2,37,58,0.5) 50%, rgba(63,111,135,0.5)); 中上开始。

chrome浏览器：
-webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(49%,transparent), color-stop(50%, rgba(2,37,58,0.5)), to(rgba(63,111,135,0.5)));

opera浏览器：
-o-linear-gradient(top, transparent, transparent 49%, rgba(2,37,58,0.5) 50%, rgba(63,111,135,0.5));

百分比的写法：起点y 终点x
-webkit-gradient(linear, 0% 100%, 100% 100%, from(#517384), color-stop(50%, #79a3b8), to(#517384));
-moz-linear-gradient(center left, rgba(81,115,132,0.55), rgba(121,163,184,0.55) 50%, rgba(81,115,132,0.55));

上一篇：WEB响应式设计:响应式Web设计的CSS框架分享

下一篇：CSS3实例教程:变形属性transform实例讲解