HTML5实操-葡萄家园素材网静态

最新推荐文章于 2022-01-24 17:08:56 发布

纯情小码哥

最新推荐文章于 2022-01-24 17:08:56 发布

阅读量565

点赞数

分类专栏： HTML5实操文章标签： HTML5实操

本文链接：https://blog.csdn.net/Liyunhao_haoge/article/details/102464931

版权

HTML5实操专栏收录该内容

3 篇文章 0 订阅

订阅专栏

葡萄家园素材网：http://www.baimin.com/top/39915.htm

代码如下：

<!DOCTYPE html>
<html>
	<head>
	<title>葡萄家园素材网</title>
	<style type  = "text/css">
	* {
		margin: 0px;
		padding: 0px;
	}
	body {
		line-height: 40px;
		font-family: "微软雅黑";
		font-size: 14px;
	}
	.Chead {
		width: 1208px;
		height: 76px;
		margin: 0 auto;
		overflow: hidden;
	}
	.hBox2 {
		float: left;
		margin-top: 22px;
	}
	.hBox3 {
		width: 770px;
		margin-left: 138px;
		margin-top: 19px;
		float: left;
		line-height: 22px;
	}
	ul {
		list-style: none;
	}
	.hBox3 ul li {
		width: 154px;
		float: left;
	}
	.erweima {
		padding-top: 8px;
	}
	.nav {
		padding-left: 357px;
		border: 1px solid green;
		background-color: rgb(8,166,115);
		overflow: hidden;
		line-heght: 40px;
	}
	.colorRed {
		color: rgb(206,48,0);
	}
	a:link {
		text-decoration: none;
		color: #3c3c3c;
	}
	a:visited {
		text-decoration: none;
		color: #3c3c3c;
	}
	a:hover {
		text-decoration: underline;
		color: rgb(206, 48, 0);
	}
	.colorGreen {
		color: green;
	}

	.nav ul li {
		width: 80px;
		color: rgb(255,255,255);
		float: left;
	}
	.currentPosition {
		padding-left: 357px;
	}
	.purpleTitle {
		margin-left: 357px;
		width: 880px;
		text-align: center;
	}
	hr {
		margin-left: 357px;
		width: 880px;
		margin-block-start: 1em;
		margin-block-end: 1em;
	}
	.purpleInfo {
		width: 880px;
		margin-left: 357px;
		padding-left: 45px;
	}
	.fankui {
		width: 880px;
		margin-left: 357px;
		text-align: center;
		line-height: 20px;
	}
	.colorBlue {
		color: rgb(49, 138, 231);
	}
	.similar {
		margin-left: 357px;
		width: 880px;
		background-color: rgb(231, 247, 241);
	}
	.similarSon {
		margin-left: 357px;
		width: 880px;
		padding: 10px;
		overflow: hidden;
	}
	.similarSon ul li {
		width: 220px;
		float: left;
	}
	.baimingLink {
		width: 880px;
		margin-left: 357px;
		text-align: center;
	}
	.fontSize12 {
		font-size: 12px;
	}
	span {
		font-weight: 700;
	}
	</style>
	</head>
	<body>
		<div class = "Chead">
			<a href = "#"><img src = "baiming.png" class = "hBox2"></a>
			<div class = "hBox3">
				<ul>
					<li class = "colorRed">最近来访网站</li>
					<li><a href = "#">355信息网</a></li>
					<li><a href = "#" class = "colorGreen">hao345导航</a></li>
					<li><a href = "#">相似网站查询</a></li>
					<li><a href = "#" class = "colorGreen">飞卢小说网</a></li>
				</ul>
				<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>
				</ul>
			</div>
			<img src = "erweima.png" class  = "erweima">
		</div>
		<div class = "nav">
			<ul>
				<li>网站百科</li>	
				<li>购物</li>
				<li>教育</li>	
				<li>旅游</li>
				<li>地方</li>	
				<li>设计</li>
				<li>货源</li>	
				<li>行业</li>
				<li>站长</li>	
				<li>医疗</li>
				<li>人才</li>	
			</ul>
		</div>
		<div class  = "currentPosition">当前位置：<a href= "#">百鸣</a><a href = "#">行业信息</a><a href = "#">设计艺术</a><a href = "#">网页设计</a>
		</div>
		<h3 class = "purpleTitle">葡萄家园素材网</h3>
		<hr />
		<div class  = "purpleInfo">
			<span>网站地址：</span>http://www.putaojiayuan.com<br />
			<span>网站名称：</span>葡萄家园素材网<br />
			<span>网站热点：</span>close,open,网站关键词,网站关键词,open<br />
			<span>登陆状态：</span>正常<br />
			<span>世界排名：</span>1067623<br />
			<span>网站介绍：</span>网站描述。<br />
		</div>
		<div class = "fankui">
			<p>网站信息及百科都收集于互联网，仅做参考，有误或非法联系本站更正。</p>
			<p>反馈意见：</p>	
			<p>视觉干扰</p>
			<p class = "colorBlue fontSize12">返回</p>
		</div>
		<div class  = "similar">
		类似“葡萄家园素材网”
		</div>
		<div class  = "similarSon">
			<ul>
				<li>宣城市眼科医院</li>
				<li>好库网</li>
				<li>葡萄家园壁纸</li>
			</ul>
		</div>
		<div class  = "similar">
			与“葡萄家园素材网”相关的网站 
		</div>
		<div class  = "similarSon">
			<ul>
				<li>懒人图库</li>
				<li>顶尖设计</li>
				<li>梦想设计</li>
				<li>中国视觉联盟</li>
			</ul>
			<ul>
				<li>大学生设计联盟</li>
				<li>创意悠悠花园</li>
				<li>设计屋网</li>
				<li>4A部落</li>
			</ul>
		</div>
		<br /><br />
		<div class  = "baimingLink">百鸣<a href = "#" class = "colorRed">www.baimin.com</a>新站登陆
		</div>
	</body>	
</html>

效果如下：

附图：

纯情小码哥

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5实操-葡萄家园素材网静态

葡萄家园素材网：http://www.baimin.com/top/39915.htm代码如下：<!DOCTYPE html><html> <head> <title>葡萄家园素材网</title> <style type = "text/css"> * { margin: 0px; paddin...
复制链接

扫一扫