html5做⽂字颜⾊渐变代码，神奇！js+CSS+DIV实现⽂字颜⾊
渐变效果_javasc。。。
本⽂实例为⼤家分享了DIV+CSS+JS实现的⽂字颜⾊渐变效果，供⼤家参考，具体内容如下
下⾯是 CSS 部分代码：
body{ font:12px/1.5 Microsoft Yahei;}h3{ padding:10px; margin:0; background-color:#999; color:#fff; font:16px/1.5 Microsoft Yahei; text-align:center;}.box{ position:relative; background-color:#fff; width:auto; margin:0 auto; padding:0 30px; font:700 20px/1.5 "Microsoft Yahei",Microsoft Yahei; border-top:1px dashed #ccc; border-bottom:1px dashed #ccc; height:30px; margin-top:8px;}.box a{ position:absolute; font-style:normal; white-space:nowrap;}.f999{ color:#999;}
下⾯是 DIV 部分代码：
CSS多彩渐变字⽂字：
R值： RGB颜⾊中的R值(0-255)
G值： RGB颜⾊中的G值(0-255)
B值： RGB颜⾊中的B值(0-255)
渐变⽅式： 灰度渐变变化R值变化G值变化B值 相应的数值会强制在0~255之间变化
OK，上⾊！
以下是 JavaScript 部分代码：
// JavaScript代码开始var rs = ElementById("rvalue");var gs = ElementById("gvalue");var bs = ElementById("bvalue");function init(){ var str; for(var i=0;i<=255;i++){ var opr =
100:opb.selected="selected";break; case 200:opg.selected="selected";break; } gs.appendChild(opg); rs.appendChild(opr); bs.appendChild(opb); } setDiv();}function setDiv(){ var font = ElementById("ctext").value; var dObj = ElementById("box"); dObj.innerHTML=font;}function createData(){ var font =
if(font==""||font=="undefined"){ font="⽂字不能为空，使⽤默认⽂字"; ElementById("ctext").value = font; }
colorful('box',font,r,g,b,type);}function colorful(obj,font,r,g,b,type){ var boxObj;
if(typeof(obj)=="string"||typeof(obj)=="number"){ boxObj = ElementById(obj); }else{ boxObj = obj; }
boxObj.innerHTML=""; var num = ElementsByTagName("a")[0].scrollWidth; boxObj.innerHTML=""; for(var
好看的css代码
i=0;i<=num;i++){ var j=i+1; var und(255/num*i); switch(Number(type)){ case 0:r=c;g=c;b=c;break; case
1:r=c;break; case 2:g=c;break; case 3:b=c;break; } var iObj = ateElement("A"); iObj.innerHTML=font;
iObj.style.clip="rect(auto "+j+"px auto "+i+"px)"; lor="rgb("+r+","+g+","+b+")"; //iObj.href="#"; // ⽣成的⽂字超链接boxObj.appendChild(iObj); }}init();《script》

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。