预定电影座位
此项目是仿照vanillawebprojects里的movie-seat-booking写的。
本项目用到的技术有:html+css+javaScript。
项目演示
这是一打开的页面
这是选择电影的页面
项目代码
html页面代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电影选座</title>
<link rel="stylesheet" href="./index.css">
</head>
<body>
<div class="movie_container">
<label for="">选择一部电影:</label>
<select name="movie" id="movie">
<option value="19.8">这么多年(¥19.8)</option>
<option value="25.6">人生路不熟(¥25.6)</option>
<option value="30">倒数说爱你(¥30)</option>
<option value="48.8">龙马精神(¥48.8)</option>
</select>
</div>
<ul class="showcase">
<li>
<div class="seat"></div>
<i>可选</i>
</li>
<li>
<div class="seat selected"></div>
<i>已选择</i>
</li>
<li>
<div class="seat occupied"></div>
<i>已售</i>