php+html+css写一个双色球代码。具有刷新出现随机数字的功能!

php+html+css写一个双色球代码。具有刷新出现随机数字的功能!
双色球最重要的便是每个球的数字变化
本代码主要实现功能是:
html实现网页框架
css做⚪修饰网页
php做随机数字显示
以这三种技术合成后,做出的双色球
代码实现:
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
figure{display:block;background:black;border-radius:50%;height:40px;
line-height:38px;width:40px;margin:20px 5px;float:left;text-align:center;
color:#FFFFFF;font-weight:bolder;}
.red{
background: -webkit-radial-gradient(10px 10px,circle,#ff0000,#000);
background: -moz-radial-gradient(10px 10px,circle,#ff0000,#000);
background: -ms-radial-gadient(10px 10px,circle,#ff0000,#000);
background: radial-gradient(10px 10px,circle,#ff0000,#000);
}
.blue{
background: -webkit-radial-gradient(10px 10px,circle,#0000ff,#000);
background: -moz-radial-gradient(10px 10px,circle,#0000ff,#000);
background: -ms-radial-gadient(10px 10px,circle,#0000ff,#000);
background: radial-gradient(10px 10px,circle,#0000ff,#000);
}
</style>
</head>
<body>
<?php
$red_num=range(1,33);
$keys=array_rand($red_num,6);
shuffle($keys);
foreach($keys as $v){
$red[]=$red_num[$v]<10?('0'.$red_num[$v]):$red_num[$v];
}
$blue_num=rand(1,16);
$blue=$blue_num<10 ? ('0'.$blue_num):$blue_num;
foreach($red as $v){
echo"<figure class=\"red\">$v</figure>";
}
echo "<figure class=\"blue\">$blue</figure>";
?>
</body>
</html>php+html+css写一个双色球代码。具有刷新出现随机数字的功能!