要求
php随机生成8个不同的随机数
效果图
index.php代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>双色球33-16</title>
<style>
.main {
border: 7px dotted #00bcff;
width: 999px;
margin: 222px auto;
padding: 28px;
font-size: 28px;
}
h1 {
text-align: center;
}
button {
height: 50px;
display: block;
margin: 20px auto;
}
button:hover {
background-color: greenyellow;
}
/* 第一种背景颜色 */
.bg1 {
display: inline-block;
background: red;
border-radius: 100%;
height: 100px;
width: 100px;
margin-right: 10px;
text-align: center;
line-height: 100px;
font-size: 50px;
color: greenyellow;
font-weight: bold;
/* background: radial-gradient(circle at 30% 35%,
#ddd,
blue 0%,
black 120%); */
background: radial-gradient(circle at 35% 20%,
#ddd,
red,
black);
}
/* 第二种背景颜色 */
.bg2 {
display: inline-block;
background: blue;
border-radius: 100%;
height: 100px;
width: 100px;
/* margin: 10px; */
text-align: center;
line-height: 100px;
font-size: 50px;
color: greenyellow;
font-weight: bold;
background: radial-gradient(circle at 35% 20%,
#ddd,
blue,
black);
}
</style>
</head>
<body>
<?php
//设置红球数组范围：1-36
$red = range(1, 33);
//随机从数组抽取8个数字
$reds = array_rand($red, 8);
//打乱排序
shuffle($reds);
//设置蓝色球数组范围
$blue = range(1, 16);
//随机选取一个的索引下标
$blues = array_rand($blue, 1);
//把下标转换为所需要的值
$b = $blue[$blues];
//访问数组索引
?>
<div class="main">
<h1>双色球33(7)+16(1)</h1>
<button onclick="sx()">开始摇号抽奖</button>
<div id="red">
<?php
foreach ($reds as $r) {
echo "<div class='bg1'>" . $red[$r] . "</div>";
}
?>
<div class="bg2" id="blue">
<?php
echo $b;
?>
</div>
</div>
<script>
function sx() {
location.reload();
}
</script>
</body>
</html>
效果图2
index1.php
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>体育彩票36选7</title>
<style>
.main {
border: 7px dotted #00bcff;
width: 999px;
margin: 222px auto;
padding: 28px;
font-size: 28px;
}
h1 {
text-align: center;
}
button {
height: 50px;
display: block;
margin: 20px auto;
}
button:hover {
background-color: greenyellow;
}
/* 第一种背景颜色 */
.bg1 {
display: inline-block;
background: blue;
border-radius: 100%;
height: 100px;
width: 100px;
/* margin: 10px; */
text-align: center;
line-height: 100px;
font-size: 50px;
color: greenyellow;
font-weight: bold;
/* background: radial-gradient(circle at 30% 35%,
#ddd,
blue 0%,
black 120%); */
background: radial-gradient(circle at 35% 20%,
#ddd,
blue,
black);
}
/* 第二种背景颜色 */
.bg2 {
background-color: red;
}
.ball {
display: inline-block;
width: 100%;
height: 100%;
margin: 0;
border-radius: 50%;
position: relative;
background-size: 100%;
}
.ball:before {
content: "";
position: absolute;
top: 0%;
left: 5%;
width: 90%;
height: 90%;
border-radius: 50%;
background: radial-gradient(circle at 30% 0px,
#ffffff,
rgba(255, 255, 255, 0) 58%);
-webkit-filter: blur(5px);
z-index: 2;
}
.ball:after {
content: "";
position: absolute;
border-radius: 100%;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: radial-gradient(circle at 50% 30%,
rgba(245, 237, 48, 0),
rgba(200, 190, 20, 0.2) 50%,
#575300 100%);
}
.ball .shadow {
position: absolute;
width: 100%;
height: 100%;
background: radial-gradient(circle,
rgba(0, 0, 0, 0.4),
rgba(0, 0, 0, 0.1) 40%,
rgba(0, 0, 0, 0) 50%);
-webkit-transform: rotateX(90deg) translateZ(-160px);
transform: rotateX(90deg) translateZ(-160px);
z-index: 1;
}
.stage {
width: 100px;
height: 100px;
display: inline-block;
margin: 10px;
text-align: center;
line-height: 100px;
font-size: 50px;
font-weight: bold;
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-ms-perspective: 1200px;
-o-perspective: 1200px;
perspective: 1200px;
-webkit-perspective-origin: 50% 50%;
-moz-perspective-origin: 50% 50%;
-ms-perspective-origin: 50% 50%;
-o-perspective-origin: 50% 50%;
perspective-origin: 50% 50%;
}
</style>
</head>
<body>
<?php
//设置数组范围：1-36
$num = range(1, 33);
//随机从数组抽取8个数字
$nums = array_rand($num, 8);
//打乱排序
shuffle($nums);
//访问数组索引
?>
<div class="main">
<h1>体育彩票36选7</h1>
<button onclick="sx()">开始摇号抽奖</button>
<div class="ball stage bg2">
<?php
echo $num[$nums[0]];
?>
</div>
<div class="ball stage bg2">
<?php
echo $num[$nums[1]];
?>
</div>
<div class="ball stage bg2">
<?php
echo $num[$nums[2]];
?>
</div>
<div class="ball stage bg2">
<?php
echo $num[$nums[3]];
?></div>
<div class="ball stage bg2">
<?php
echo $num[$nums[4]];
?>
</div>
<div class="ball stage bg2">
<?php
echo $num[$nums[5]];
?>
</div>
<div class="ball stage bg2">
<?php
echo $num[$nums[6]];
?>
</div>
<div class="bg1">
<?php
echo $num[$nums[7]];
?>
</div>
</div>
<script>
function sx() {
location.reload();
}
</script>
</body>
</html>
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/83748.html
