html-流行歌曲 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>歌曲</title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			.wrap {
				width: 300px;
				margin: 40px auto;
				font-size: 18px;
				line-height: 40px;
			}

			.wrap h2 {
				line-height: 60px;
			}
			a{
				text-decoration: none;
			}
			.mus .you{
				color: #A96589;
			}
			.mus .per{
				color: #0B926C;
				font-size: 22px;
				margin-left: 10px;
			}
			.mus .ugl{
				color: #FEC58F;
				font-size: 22px;
			}
			.mus .lov{
				margin: 0 14px;
				color: #56B39A;
			}
			.mus .hol{
				font-size: 22px;
				color: #FB4599;
				vertical-align: middle;
			}
			.mus .say{
				color: #41A182;
				font-size: 22px;
				margin-right: 14px;
			}
			.mus .whe{
				color: #81BFDA;
			}
		</style>
	</head>
	<body>
		<div class="wrap">
			<h2>流行热歌</h2>
			<div class="mus">
				<p>
					<a href="javascript:;" class="you">你是我的唯一(Live)</a>
					<a href="javascript:;" class="per">演员</a>
				</p>
				<p>
					<a href="javascript:;" class="ugl">丑八怪</a>
					<a href="javascript:;" class="lov">告白气球</a>
					<a href="javascript:;" class="hol">锦绣未央</a></p>
				<p>
					<a href="javascript:;" class="say">只对你说</a>
					<a href="javascript:;" class="whe">当我找到了你</a>
				</p>
			</div>
		</div>
	</body>
</html>

posted @ 2020-02-15 21:26  JackieDYH  阅读(5)  评论(0)  编辑  收藏  举报  来源