HTML中div做圆点击变色,HTML+CSS入门 利用div+CSS实现九宫格，然后用js实现点击每个格子可以随机更改格子(div)的背景颜色...

本篇教程介绍了HTML+CSS入门 利用div+CSS实现九宫格，然后用js实现点击每个格子可以随机更改格子(div)的背景颜色，希望阅读本篇文章以后大家有所收获，帮助大家HTML+CSS入门。

<

html>

div+css+js实现九宫格点击随机变色

var inner = document.getElementsByClassName("inner");

function ChangeColor(num){

var a = parseInt(Math.random()*10);

var b = parseInt(Math.random()*10);

var c = parseInt(Math.random()*10);

var d = parseInt(Math.random()*10);

var e = parseInt(Math.random()*10);

var f = parseInt(Math.random()*10);

var g = "#"+a+b+c+d+e+f;

inner[num].style.backgroundColor=g;

//            log.innerHTML=g;

//            inner[num].style.backgroundColor="rgb("+parseInt(Math.random()*255)+","+parseInt

//            (Math.random()*255)+","+parseInt(Math.random()*255)+")";

}

#outer{

width:306px;

}

#outer div{

height:100px;

width:100px;

background-color: #ff00ff;

float: left;

line-height:100px;

text-align: center;

margin-left:2px;

margin-top:2px;

}

1

2

3

4

5

6

7

8

9

本文由职坐标整理发布，欢迎关注职坐标WEB前端HTML/CSS频道，获取更多HTML/CSS知识！