|
仿茅台集网页设计要是用HTML DIV+CSS JS等来完成页面的排版设计。
网页有搜素框 导航栏 js照片轮播；
网页由网站首页，机构简介，机构发展历程，最新资讯动态构成；
详细效果图展示：
首页html代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>茅台集团</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<link href="css/index.css" rel="stylesheet" type="text/css"/>
<link href="css/base.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<!--顶部-->
<div class="top">
<b><img src="images/logo.gif" /></b>
<ul>
<li>
<a href="#">设为首页</a>
<div class="line2"></div>
<a href="#">保藏网站</a>
<div class="line2"></div>
<a href="#">联系咱们</a>
</li>
<div class="text2">
<input type="text" class="text" />
<input type="image" src="images/Button.gif" class="imag"/>
</div>
</ul>
</div>
<!--导航-->
<div class="nav">
<ul>
<li>
<a href="index.html" > 首页</a>
</li>
<li>
<a href="summary.html" > 机构简介</a>
</li>
<li>
<a href="Products.html" >机构发展</a>
</li>
<li>
<a href="News.html" >最新信息</a>
</li>
</ul>
</div>
<!--banner-->
<div class="banner" style="width:1000px;margin:auto">
<ul>
<p><img src="images/banner2.gif" /></p>
<p><img src="images/banner3.gif" /></p>
<div><span class="current"></span><span></span><span></span></div>
</ul>
</div>
<!--整体容器-->
<div class="Container">
<!--机构简介-->
<ul class="summary_title">
<b><img src="images/icon.gif" /></b>
<p>机构简介</p>
<span>COMPANY INTRODUCTION</span>
</ul>
<div class="summary">
<b><img src="images/p3.gif" width="100" /></b>
<ul>
<p><span>中国贵州茅台酒厂（集团）有限责任机构：</span> 中国贵州茅台酒厂(集团)有限责任机构(以下简叫作茅台集团)是国家特大型国有企业，总部位置于贵州遵义市茅台镇，平均海拔 423 米，占地约1.5万亩，其中茅台酒地理标志制品守护地域面积为15.03平方千米，员工3.6万余人。 </p>
</ul>
</div>
<div class="Box">
<!--最新信息-->
<div class="news">
<div class="news_title">
<b><img src="images/icon2.gif" /></b>
<span>最新信息</span>
<a>NEWS</a>
</div>
<div class="news_text">
<a href="#">MORE </a>
<b><img src="images/p1.gif" width="200" /></b>
<ul>
<li><img src="images/Point.gif" />茅台集团举行辛丑年（2021）“端午祭麦”仪式
<span>[2021-6.17]</span>
</li>
<p>6月14日，农历五月初五，早上8时28分，茅台集团辛丑年(2021)“端午祭麦”仪式在“茅酒之源”酿酒工业遗址广场举行，这标志着辛丑年茅台酒制曲生产的起始。茅台集团党委委员、副总经理万波参加仪式。 </p>
</ul>
</div>
<div class="clear"></div>
</div>
<!--联络咱们-->
<div class="Contact">
<div class="news_title">
<span>联络咱们</span>
<a>CONTACT US</a>
</div>
<div class="Contact_text">
<b><p><input type="submit" value="在线咨询" class="sub" /></p></b>
<ul>
<span></span>
<li>机构名叫作：中国贵州茅台酒厂（集团）有限责任机构</li>
<li>机构位置：贵州省仁怀市茅台镇</li>
<li>邮箱位置：service@moutaichina.com</li>
<li>邮政编码：564501 </li>
</ul>
</div>
</div>
</div>
<!--底部-->
<div class="clear"></div>
<div class="bottom">
<ul>
<li><a href="">首页</a></li>
<li class="line"></li>
<li><a href="">机构简介</a></li>
<li class="line"></li>
<li><a href="">机构发展</a></li>
<li class="line"></li>
<li><a href="">最新信息</a></li>
<li class="line"></li>
<li><a href="">视频</a></li>
<li class="line"></li>
</ul>
<p class="bottom_text">版权所有：茅台集团</p>
</div>
</body>
<script src="js/js.js" type="text/javascript"></script>
</html>
| 
发表于 2024-7-27 20:43:51