weather-rendering
/
index.html

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>天知道</title>
		<link rel="stylesheet" href="css/reset.css" />
		<link rel="stylesheet" href="css/index.css" />
	</head>

	<body>
		<div class="wrap" id="app">
			<div class="search_form">
				<div class="logo"><img src="img/logo.png" alt="logo" /></div>
				<div class="form_group">
					<!-- 搜索框 -->
					<input type="text" class="input_txt" placeholder="请输入查询的天气" />
					<!-- 搜索按钮 -->
					<button class="input_sub">搜 索</button>
				</div>
				<!-- 热门城市 -->
				<div class="hotkey">
					<!-- <a href="javascript:render('北京');">北京</a>
					<a href="javascript:render('上海');">上海</a>
					<a href="javascript:render('广州');">广州</a>
					<a href="javascript:render('深圳');">深圳</a> -->
					<a href="javascript:;">北京</a>
					<a href="javascript:;">上海</a>
					<a href="javascript:;">广州</a>
					<a href="javascript:;">深圳</a>
				</div>
			</div>
			<!-- 搜索结果 -->
			<ul class="weather_list">
				<!-- 列表项 -->
				<li>
					<div class="info_type"><span class="iconfont">小雨</span></div>
					<div class="info_temp">
						<b>低温 4℃</b>
						~
						<b>高温 13℃</b>
					</div>
					<div class="info_date"><span>3日星期一</span></div>
				</li>
				<li>
					<div class="info_type"><span class="iconfont">中雪</span></div>
					<div class="info_temp">
						<b>低温 2℃</b>
						~
						<b>高温 6℃</b>
					</div>
					<div class="info_date"><span>4日星期二</span></div>
				</li>
			</ul>
		</div>
		<script src="./node_modules/axios/dist/axios.js"></script>
		<script src="./index.js"></script>
	</body>
</html>