红色实用风格的礼品包装定制整站网站源码下载



13 48 17



模板描述:红色实用风格 礼品包装定制 整站网站,红色实用风格的礼品包装定制整站网站源码下载html模板下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/default.css" />
<link rel="stylesheet" href="css/index.css" />

2. 引入JS

<script type="text/javascript" src="js/jquery-1.8.0.min.js" ></script>
<script type="text/javascript" src="js/jquery.superslide.2.1.1.js" ></script>
<script type="text/javascript" src="js/index.js" ></script>

3. HTML代码

<!--header-->
<div class="headerWrap">
	<div class="header w1200 cleafix">
		<!--logo-->
		<div class="logo fl"><a href="#"><img src="picture/logo.png" /></a></div>
		<!--nav-->
		<ul id="nav" class="nav clearfix">
			<li class="nLi on">
				<h3><a href="#">首页</a></h3>
			</li>
			<li class="nLi">
				<h3><a href="about.html">关于饭心</a></h3>
				<ul class="sub">
					<li><a href="company_overview.html">企业概述</a></li>
					<li><a href="development.html">发展历程</a></li>
					<li><a href="#">理想愿景</a></li>
				</ul>
			</li>
			<li class="nLi">
				<h3><a href="show.html">产品展示</a></h3>
			</li>
			<li class="nLi ">
				<h3><a href="accepted.html">招贤纳士</a></h3>
			</li>
			<li class="nLi">
				<h3><a href="cooperation.html">商务合作</a></h3>
			</li>
		</ul>
		<!--预约提货-->
		<div class="heaR"><a href="#">预约提货</a></div>
	</div>
</div>
<!--banner-->
<div class="slideBox">
	<div class="hd">
		<ul><li></li><li></li><li></li></ul>
	</div>
	<div class="bd">
		<ul>
			<li><a href="#"><img src="picture/banner.jpg" /></a></li>
			<li><a href="#"><img src="picture/banner.jpg" /></a></li>
			<li><a href="#"><img src="picture/banner.jpg" /></a></li>
		</ul>
	</div>
</div>
<!--页面主体部分-->
<!--关于饭心-->
<div class="mainBox">
	<div class="main w1200">
		<div class="mainTitle">
			<h2>ABOUT  US</h2>
			<h3>关于饭心</h3>
			<em></em>
		</div>
		<!--图片轮播-->
		<div class="Picshuff">
			<h2>北京缔造品质旗下品牌,健康食品的供应商</h2>
			<p>我们要用健康味道,带您感受大自然的奇妙。饭心绿色供应链,将理想田的健康味道带到您的身边。为您寻找更多有益<br />健康的原生食材,饭心,只为给你更健康。</p>
			<div class="picScroll-left">
				<div class="hd">
					<a class="next"></a>
					<a class="prev"></a>
				</div>
				<div class="bd">
					<ul class="picList cleafix">
						<li>
							<a href="#">
								<i class="ico"></i>
								<p>全套定制</p>
							</a>
						</li>
						<li>
							<a href="#">
								<i class="ico1"></i>
								<p>腰封定制</p>
							</a>
						</li>
						<li>
							<a href="#">
								<i class="ico2"></i>
								<p>礼品册</p>
							</a>
						</li>
					</ul>
				</div>
			</div>
			<h3 class="More"><a href="#">了解更多</a></h3>
		</div>
	</div>
</div>
<!--产品展示-->
<div class="mainBox mainBox1">
	<div class="main w1200">
		<div class="mainTitle">
			<h2>PRODUCT  DISPIAY</h2>
			<h3>产品展示</h3>
			<em></em>
		</div>
		<div class="show_bot show_bot1">
			<ul class="cleafix">
				<li>
					<a href="#">
						<i><img src="picture/pic1.jpg"></i>
						<p>意大利DONNACHIC公司<em></em></p>
					</a>
				</li>
				<li>
					<a href="#">
						<i><img src="picture/pic2.jpg"></i>
						<p>千枣红酒品礼品包装定制<em></em></p>
					</a>
				</li>
				<li>
					<a href="#">
						<i><img src="picture/pic3.jpg"></i>
						<p>中鹤集团外婆面馆礼品定制<em></em></p>
					</a>
				</li>
				<li>
					<a href="#">
						<i><img src="picture/pic4.jpg"></i>
						<p>饭心慕溪黑糖健康食品<em></em></p>
					</a>
				</li>
			</ul>
			<h3 class="More"><a href="#">了解更多</a></h3>
		</div>
	</div>
</div>
<!--饭心服务-->
<div class="mainBox mainBox2">
	<div class="main w1200">
		<div class="mainTitle">
			<h2>FUNXIN  SERVICE</h2>
			<h3>饭心服务</h3>
			<em></em>
		</div>
		<div class="server_b">
			<div class="hd">
				<ul><li></li><li></li><li></li></ul>
			</div>
			<div class="bd">
				<ul class="cleafix">
					<li>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>安全食品</h2>
									<em></em>
									<p>倾力打造线上线下全渠道的销售模式</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img1.jpg"></div>
							</a>
						</div>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>礼品定制</h2>
									<em></em>
									<p>专属企业私人礼品视觉定制</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img2.jpg"></div>
							</a>
						</div>
					</li>
					<li>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>安全食品</h2>
									<em></em>
									<p>倾力打造线上线下全渠道的销售模式</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img1.jpg"></div>
							</a>
						</div>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>礼品定制</h2>
									<em></em>
									<p>专属企业私人礼品视觉定制</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img2.jpg"></div>
							</a>
						</div>
					</li>
					<li>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>安全食品</h2>
									<em></em>
									<p>倾力打造线上线下全渠道的销售模式</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img1.jpg"></div>
							</a>
						</div>
						<div>
							<a href="#">
								<div class="serTxt">
									<h2>礼品定制</h2>
									<em></em>
									<p>专属企业私人礼品视觉定制</p>
									<span></span>
								</div>
								<div class="serPic"><img src="picture/img2.jpg"></div>
							</a>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</div>
</div>
<!--饭心客户-->
<div class="mainBox mainBox1">
	<div class="main w1200">
		<div class="mainTitle">
			<h2>CUSTOMER</h2>
			<h3>饭心客户</h3>
			<em></em>
		</div>
		<div class="customer cleafix">
			<ul>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
				<li><a href="#"><img src="picture/img3.jpg" /></a></li>
			</ul>
		</div>
		<h3 class="More"><a href="#">了解更多</a></h3>
	</div>
</div>
<!--footer-->
<div class="footerWrap">
	<div class="footer w1200 cleafix">
		<ul>
			<li>
				<h2>CONTACT</h2>
				<h3>联系饭心</h3>
				<div class="fooM cleafix">
					<i><img src="picture/ico_btn1.png"></i>
					<div class="divTxt fl">
						<h4>ADDRESS</h4>
						<em></em>
						<p>北京市朝阳区北苑领地office大厦</p>
					</div>
				</div>
				<div class="fooM cleafix">
					<i><img src="picture/ico_btn2.png"></i>
					<div class="divTxt fl">
						<h4>PHONE</h4>
						<em></em>
						<p>15801014527 / 13810977519    李爽</p>
					</div>
				</div>
			</li>
			<li>
				<h2>&nbsp;</h2>
				<h3>&nbsp;</h3>
				<div class="fooM cleafix">
					<i><img src="picture/ico_btn3.png"></i>
					<div class="divTxt fl">
						<h4>E-MAIL</h4>
						<em></em>
						<p>Lishuang@fanxin100.com</p>
					</div>
				</div>
				<div class="fooM cleafix">
					<i><img src="picture/ico_btn4.png"></i>
					<div class="divTxt fl">
						<h4>相关说明</h4>
						<em></em>
						<p><a href="#">隐私政策</a><a href="#">法律声明</a><a href="http://www.51qianduan.com//">使用条款</a></p>
					</div>
				</div>
			</li>
			<li>
				<h2>FOCUS  ON</h2>
				<h3>关注饭心</h3>
				<span><img src="picture/webchat.png" /></span>
				<p>扫描关注饭心官网微信!</p>
			</li>
		</ul>
	</div>
	<div class="fooTxt">Copyright © 2016  饭心网  保留所有权利</div>
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 扁平化 企业 行业 公司 工厂 bootstrap bootstrap自适应 bootstrap响应式 pc+wap 移动+电脑 手机+电脑 红色 简洁 简约 简单 文化传媒 文化 传媒

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到