第二种就是在ltbody内 加入 style=quotfilterprogidstartColorStr=#39#7CBE42#39， endColorStr=#39#84C34A#39， gradientType=#390#39quot 演示 wenwenhtml；1打开html开发工具，新建一个html文件在html代码页面创建一个p并给这个标签添加一个类名linear2然后为类设置样式在title后面创建一个style标签，然后在这个标签里面设置linear类的高渐变lineargradient的样式；Linear Gradients线性渐变向下向上向左向右对角方向 向下代码仅供参考lt！DOCTYPE html lthtml lthead lttitlelttitle ltstyle type=quottextcssquot box width 300pxheight 300pxbackground；1HTML实现渐变 lt！DOCTYPE html lthtml lthead ltmeta charset=quotUTF8quot lttitlelttitle ltstyle week width 600pxheight 600pxbackground lineargradientred， yellow， blueborderradius 300px；以下代码，点击第一个按钮，然后立即点击第二个按钮，第二个按钮的事件虽然触发了，但是执行效果要等到第一个效果结束才执行，所以做渐变的效果时，一定要明白执行顺序，从而确定执行速度lthtmlltheadltscript type=quottext；我是建一个三行一例的表格，用如下代码替换ltTD lttdlttd style=quotBORDERRIGHT #fffffff 0px solid BORDERTOP #000000 0px solid FILTER progidstartColorStr=#39#000000#39；1启动DW软件，新建一个网页文件，在body中添加一个 标签，然后给他一定CSS样式，width300pxheight200pxbackground#ff0000我们可以看到填充了背景色为红色2然后我们添加线性渐变代码backgroundwebkitlinear。

2在html代码页面创建一个ltdiv并给这个标签添加一个类如linear如图代码ltdiv class=quotlinearquotltdiv3为类设置样式在lttitle后面创建一个ltstyle标签，然后在这个标签里面设置linear类的高渐变lineargr；一方法一借助maskimage属性如果您手头上的浏览器是Chrome或是Safari，则您可以在demo页面中看到类似下面的效果相应的HTML代码如下codeh2 class=quottextgradientquot datatext=quot天赐美妞quot天赐美妞h2codebutton；用input页面标签 并将下Border设为直线 ltstyle inputtype=quottextquotborderbottomsolid 1px #ccc ltstyle ltinput type=quottextquot 1两头渐变透明ltHR style=quotFILTER alphaopacity=100，finishopacity=0，style；lt！DOCTYPE html lthtml lthead ltmeta charset=quotUTF8quot lttitlelttitle ltstyle type=quottextcssquot demo width200pxheight10pxbackgroundwebkitlineargradientleft， rgb80，80，255，02 ， #fff。

首先确定要使用的背景颜色，HTML颜色由每个代码决定在计算机的Web浏览器中访问colornameshtml，就能查看所有颜色的代码，并且在“HEX”部分中选择要使用的基色使用Notepad++或Notepad打开HTML；2在indexhtml中的ltstyle标签中，输入css代码divwidth200pxheight150pxbackgroundlineargradientred，white 3浏览器运行indexhtml页面，此时td中的div的背景颜色从红色到白色渐变。

html中将背景颜色渐变步骤如下1先使用一个div标签2然后在header标签里面设置ltdiv标签的css样式3颜色渐变要有一个范围，需要给div设定width和height，也就是宽度和高度4然后设定div的background背景属性，如图；不同浏览器使用的内核不同，导致对渐变的代码写法也不同一Webkit 又称Safari内核，Chrome内核原型，它是苹果公司自己的内核，也是苹果的Safari浏览器使用的内核360急速浏览器，浏览器搜狗浏览器用的是Webkit内核尽。