h5(梅花网页制作)_html梅花-CSDN博客

本文链接：https://blog.csdn.net/weixin_46244909/article/details/115034790

<!DOCTYPE html>
<html>
<head>
	<title>梅花网</title>
</head>
<style type="text/css">
	*{
		margin: 0;
		padding: 0;
	}
	header{
		background-image: url(img/timg.jpg);
		height: 214px;
		width: 805px;
		margin: 0 auto;
	}
	a{
		text-decoration: none;
		padding-left: 31px;
		padding-right: 31px;
		height: 50px;
		line-height: 50px;
		color: #fdfdfd;
		text-align: center;
		padding-bottom: 20px;
		padding-top: 20px;

	}
	li a:hover {
  		background-color: yellow;
	}
	li{
	
		float: left;
	}
	ul{
		list-style-type: none;
		margin: 0;
		padding: 0;
		overflow: hidden;
		background-color: #3c2201;

	}
	li a {
		  display: block;
		  color: white;
		  text-align: center;
		  padding: 1px 31px;
		  text-decoration: none;
}
	nav{
		height: 50px;
		width: 805px;
		background: ;
		margin: 0 auto;
	}
	article{
		width: 805px;
		height: auto;
		margin: 0 auto;
		background-color: #f8f7f2;
	}
	h1{
		text-align: center;
		margin-bottom: 20px;
		border-bottom: 1px solid;
		border-color: #c3cac2;
		height: 50px;
		width: 600px;
	}
	p{
		 text-indent:2em;
		 margin: 15px;
	}
	footer{
		width: 805px;
		height: 50px;
		text-align: center;
		margin: 0 auto;
	}

</style>
<body style="background-color: black;">
	<header></header>
	<nav>
		<ul>
			<li><a href="">红梅</a></li>
			<li><a href="">宫粉梅</a></li>
			<li><a href="">绿梅</a></li>
			<li><a href="">青梅</a></li>
			<li><a href="">花梅</a></li>
			<li><a href="">胭脂梅</a></li>
			<li><a href="">绿鄂梅</a></li>
			<li><a href="">更多</a></li>
		</ul>
	</nav>
	<article>
		<center>
		<h1>红梅介绍</h1>
		<p>红梅是梅花的一种，这种植物可用于园林、绿地、庭园、风景区，可孤植、丛植、群植等；也可屋前、坡上、石际、路边自然配植。可用常绿乔木或深色建筑作背景，衬托出梅花玉洁冰清之美。古代强调"梅花绕屋"、"登楼观梅"等，均是为了获得最佳的观赏效果。另外，梅花可布置成梅岭、梅峰、梅园、梅溪、梅径等。</p>
		<p>红梅是梅花的一种，这种植物可用于园林、绿地、庭园、风景区，可孤植、丛植、群植等；也可屋前、坡上、石际、路边自然配植。可用常绿乔木或深色建筑作背景，衬托出梅花玉洁冰清之美。古代强调"梅花绕屋"、"登楼观梅"等，均是为了获得最佳的观赏效果。另外，梅花可布置成梅岭、梅峰、梅园、梅溪、梅径等。</p>
		<p>红梅是梅花的一种，这种植物可用于园林、绿地、庭园、风景区，可孤植、丛植、群植等；也可屋前、坡上、石际、路边自然配植。可用常绿乔木或深色建筑作背景，衬托出梅花玉洁冰清之美。古代强调"梅花绕屋"、"登楼观梅"等，均是为了获得最佳的观赏效果。另外，梅花可布置成梅岭、梅峰、梅园、梅溪、梅径等。</p>
		</center>
		<img src="img/1.jpg">
	</article>
	<footer style="background-color: #f8f7f2; ">
		<center>
			<p style="margin: 0px;border-top: 1px solid;line-height: 50px;border-color: #c3cac2;">19计算机应用技术1班郭瑞鹏</p>
		</center>
	</footer>
</body>
</html>