前言：
目前你们对“css抽奖”大约比较注意，你们都需要了解一些“css抽奖”的相关内容。那么小编在网摘上网罗了一些关于“css抽奖””的相关内容，希望你们能喜欢，大家一起来了解一下吧！本篇只说抽奖页面的html和css，想看js的请看下一篇
下一篇的链接：
html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>手机号抽奖</title>
<link rel="stylesheet" href="./demo.css">
<script src=""></script>
<script src="./demo.js"></script>
</head>
<body>
<div class="container">
<!-- 左边 -->
<div class="left">
<h2>抽奖活动</h2>
<select class="level">
<option value="3">3等奖</option>
<option value="2">2等奖</option>
<option value="1">1等奖</option>
</select>
<div class="resule-box">159****0000</div>
<button class="start" onclick="start()">开始抽奖</button>
</div>
<!-- 右边 -->
<div class="list"></div>
</div>
</body>
</html>
css：
*{ margin:0; padding: 0; }
html,body{ width: 100%; height: 100%; background:radial-gradient(#f50607,#800807);
background:-webkit-radial-gradient(#f50607,#800807); background:-o-radial-gradient(#f50607,#800807); background:-moz-radial-gradient(#f50607,#800807); }
.container{width: 500px; margin: 0 auto;padding: 100px;overflow: hidden;}
.left{ width: 250px; float: left; }
.left h2{ color: #fff; text-align: center; line-height: 50px; }
.level,.resule-box,.start{ width: 250px; height: 40px; margin-top: 10px; border-radius: 5px; font-size: 18px;}
.resule-box{ color: #555; background: #fff; text-align: center; line-height: 40px;}
.start{ background: #428bca; color: #fff; border:none; text-align: center; line-height: 40px; }
.list{ width: 200px; min-height: 250px; background: #fff; border-radius: 5px; float: right; padding: 10px;}
.bg{width:250px;height:40px;background: none; color: #fff; border:none; text-align: center; line-height: 40px; margin-top: 13px;}
标签： #css抽奖 #jquery大转盘抽奖原理
