用html+css+javascript写一个简易红绿灯
工具/原料
使用windows自带记事本
方法/步骤
1、新建一个.html文件，用记事本打开。
2、在记事本中复制添加以下内容并保存：<html><head>挢旗扦渌;<title>红绿灯&l墉掠载牿t;/title><style>#div1div{width:200px;height:200px;background:pink;border:2pxsolidblue;float:left;margin:10px;border-radius:100%;}#div1{width:680px;height:220px;background:pink;border:2pxsolidblack;margin-left:25%;}</style><script>window.onload=function(){vardivs=document.getElementById('div1').getElementsByTagName('div');varindex=0;varcolor=['red','yellow','green'];setInterval(f1,1000);f1();functionf1(){for(vari=0;i<3;i++){divs[i].style.background='gray';}divs[index].style.background=color[index];index==2?index=0:index++;}}</script></head><body><h1style="text-align:center;margin-top:10%;">红绿灯</h1><divid="div1"><div></div><div></div><div></div></div></body></html>
3、用浏览器打开此文件
4、效果截图：
