黑色实用风格的调味品企业网站源码下载



8 31 11



模板描述:黑色实用风格 调味品 企业网站,黑色实用风格的调味品企业网站源码下载html模板下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/common.css" />
<link rel="stylesheet" href="css/animate.min.css" />

2. 引入JS

<script type="text/javascript" src="js/jquery.1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>
<script type="text/javascript" src="js/wow.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>

3. HTML代码

		<div class="g-doc">
			<!--header start-->
			<div class="g-head">
				<div class="ydsz_nav">
					<div class="ydsz_nav_kd">
						<div class="logo1">
							<a href="/"><img src="images/logo.png" /></a>
						</div>
						<div class="ggy">
							<h1>云南调味品商城.手机</h1>
							<span>您的满意是我们最大的愿望</span>
						</div>
						<div class="dianhua">
							<h1>全国服务热线:</h1>
							<span>00000000000000000000</span>
						</div>
					<!--daohang-->
					<div class="daohang">
						<ul id="nav" class="nav clearfix">
							<li class="nLi on">
								<h3><a href="index.html">网站首页</a></h3>
							</li>
							<li class="nLi">
								<h3><a href="aboutlist.html">关于我们</a></h3>
								<ul class="sub">
									<li>
										<a href="#">公司简介</a>
									</li>
									<li>
										<a href="#">荣誉资质</a>
									</li>
								</ul>
							</li>
							<li class="nLi">
								<h3><a href="productlist.html">产品展示</a></h3>
								<ul class="sub">
									<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>
							</li>
							<li class="nLi">
								<h3><a href="productlist.html">成品展示</a></h3>
								<ul class="sub">
									<li>
										<a href="#">观光采摘</a>
									</li>
									<li>
										<a href="#">车厘子</a>
									</li>
									<li>
										<a href="#">苗木</a>
									</li>
								</ul>
							</li>
							<li class="nLi">
								<h3><a href="newslist.html">新闻动态</a></h3>
								<ul class="sub">
									<li>
										<a href="#">公司动态</a>
									</li>
									<li>
										<a href="#">行业资讯</a>
									</li>
								</ul>
							</li>
							<li class="nLi">
								<h3><a href="joblist.html">人才招聘     </a></h3>
							</li>
							<li class="nLi">
								<h3><a href="contact.html">联系我们</a></h3>
							</li>
						</ul>
						<script id="jsID" type="text/javascript">
							jQuery("#nav").slide({
								type: "menu", // 效果类型,针对菜单/导航而引入的参数(默认slide)
								titCell: ".nLi", //鼠标触发对象
								targetCell: ".sub", //titCell里面包含的要显示/消失的对象
								effect: "slideDown", //targetCell下拉效果
								delayTime: 300, //效果时间
								triggerTime: 0, //鼠标延迟触发时间(默认150)
								returnDefault: true //鼠标移走后返回默认状态,例如默认频道是"预告片",鼠标移走后会返回"预告片"(默认false)
							});
						</script>
					</div>
					<!--daohang-->
					</div>
				</div>
			</div>
			<!--幻灯-->
			<div class="indexhdbox">
				<div class="focusBox">
					<div class="bd">
						<ul>
							<li><img src="images/banner.jpg" /></li>
							<li><img src="images/banner.jpg" /></li>
							<li><img src="images/banner.jpg" /></li>
							<li><img src="images/banner.jpg" /></li>
						</ul>
					</div>
					<a class="prev" href="javascript:void(0)"></a>
					<a class="next" href="javascript:void(0)"></a>
				</div>
				<script type="text/javascript">
					jQuery(".focusBox").slide({
						titCell: ".hd ul",
						mainCell: ".bd ul",
						effect: "left",
						autoPlay: true,
						autoPage: true,
						delayTime: 600,
						switchLoad: "_src"
					});
				</script>
			</div>
			<!--幻灯end-->
			<!--header end-->
			<div class="g-case wow bounceIn">
				<img src="images/tl06.jpg" />
			</div>
			<div style=" clear:both;"></div>
			<!--main start-->
			<div class="g-xiangmu ">
				<div class="jj_bt wow shake">
					<a href="#"><img src="images/tl08.png" /> </a>
				</div>
				<div class="picMarquee-left wow bounceIn">
					<div class="hd">
						<a class="next"></a>
						<a class="prev"></a>
					</div>
					<div class="bd">
						<ul class="picList">
							<li>
								<a href="#" target="_blank"><img src="images/1.jpg" /></a>
								<div class="title1">
									<a href="#" target="_blank">效果图1</a>
								</div>
							</li>
							<li>
								<a href="#" target="_blank"><img src="images/2.jpg" /></a>
								<div class="title1">
									<a href="#" target="_blank">效果图1</a>
								</div>
							</li>
							<li>
								<a href="#" target="_blank"><img src="images/3.jpg" /></a>
								<div class="title1">
									<a href="#" target="_blank">效果图1</a>
								</div>
							</li>
							<li>
								<a href="#" target="_blank"><img src="images/4.jpg" /></a>
								<div class="title1">
									<a href="#" target="_blank">效果图1</a>
								</div>
							</li>
							<li>
								<a href="#" target="_blank"><img src="images/5.jpg" /></a>
								<div class="title1">
									<a href="#" target="_blank">效果图1</a>
								</div>
							</li>
						</ul>
					</div>
					<div class="more1">
						<a href="#">查看更多</a>
					</div>
				</div>
				<script type="text/javascript">
					jQuery(".picMarquee-left").slide({
						mainCell: ".bd ul",
						autoPlay: true,
						effect: "leftMarquee",
						vis: 4,
						interTime: 50
					});
				</script>
			</div>
			<div class="clear"></div>
			<div class="gongdi wow flash">
				<div class="jj_bt1">
					<a href="#"><img src="images/tl10.png" /> </a>
				</div>
				<div class="picScroll-left">
					<div class="hd">
						<a class="next"></a>
						<a class="prev"></a>
					</div>
					<div class="bd">
						<ul class="picList">
							<li class="con-six">
								<img class="conimg-two" src="images/9.jpg" />
								<div class="txt-six">
									<h3>图片四</h3>
									<!--<p>小学、初中、高中各科课程在线辅导</p>-->
								</div>
							</li>
							<li class="con-six">
								<img class="conimg-two" src="images/7.jpg" />
								<div class="txt-six">
									<h3>图片四</h3>
									<!--<p>小学、初中、高中各科课程在线辅导</p>-->
								</div>
							</li>
							<li class="con-six">
								<img class="conimg-two" src="images/8.jpg" />
								<div class="txt-six">
									<h3>图片四</h3>
									<!--<p>小学、初中、高中各科课程在线辅导</p>-->
								</div>
							</li>
							<li class="con-six">
								<img class="conimg-two" src="images/9.jpg" />
								<div class="txt-six">
									<h3>图片四</h3>
									<!--<p>小学、初中、高中各科课程在线辅导</p>-->
								</div>
							</li>
						</ul>
					</div>
				</div>
				<script type="text/javascript">
					jQuery(".picScroll-left").slide({
						titCell: ".hd ul",
						mainCell: ".bd ul",
						autoPage: true,
						effect: "left",
						autoPlay: true,
						vis: 2
					})
				</script>
			</div>
			<div class="clear"></div>
			<div class="guanyu_bg">
				<div class="guanyu">
					<div class="news-left wow bounceInLeft ">
						<div class="biaoti3">
							<a href="#">新闻中心</a>
						</div>
						<div class="b-news">
							<ul>
								<li>
									<h2><a href="#">常见隔板墙成本常见隔板墙成本分析常见隔板墙成本分析常见隔板墙成本分析分析</a><span>2010-10-20</span></h2></li>
								<li>
									<h2><a href="#">常见隔板墙成本分析</a></h2></li>
								<li>
									<h2><a href="#">常见隔板墙成本分析</a></h2></li>
								<li>
									<h2><a href="#">常见隔板墙成本分析</a></h2></li>
								<li>
									<h2><a href="#">常见隔板墙成本分析</a></h2></li>
								<li>
									<h2><a href="#">常见隔板墙成本分析</a></h2></li>
							</ul>
						</div>
					</div>
					<div class="news-right wow bounceInRight">
						<div class="biaoti4">
							<a href="#">公司简介</a>
						</div>
						<div class="b-news1">
							<p>常见隔板墙成本常见隔板墙成本分析常见隔板墙成本分析常见隔板墙成本分析分析常见隔板墙成本常见隔板墙成本分析常见隔板墙成本分析常见隔板墙成本分析分析常见隔板墙成本常见隔板墙成本分析常见隔板墙成本分析常见隔板墙成本分析分析常见隔板墙成本常见隔板墙成本分析常见隔板墙成本分析常见隔板墙成本分析分析</p>
							<img class="conimg-two" src="images/5.jpg" />
						</div>
						<div class="erxian">
							<p>00000000000</p>
						</div>
					</div>
				</div>
			</div>
			<div class="dibu">
				<div class="dibu1">
					<div class="logo2">
						<a href="#"><img src="images/logo.png" /></a>
					</div>
					<div class="lianxi">
						<p>地址:0000000000000000</p>
						<p>联系电话:000000000000000</p>
						<p>手机:</p>
						<p>网址:</p>
						<p>电子邮箱:00000000000000000</p>
						<p>某某食品公司工程有限公司 版权所有&nbsp;&nbsp;
							<a href="#"> 备案号:备案中</a>&nbsp;&nbsp;
							<a href="#"></a>
						</p>
					</div>
					<div class="ewm">
						<a href="#"><img src="images/banner.jpg" /></a>
						<span>扫一扫微信二维码</span>
					</div>
				</div>
			</div>
		</div>



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


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 企业 行业 公司 工厂 黑色 bootstrap bootstrap自适应 bootstrap响应式 pc+wap 移动+电脑 手机+电脑 实用通用 实用 通用 餐饮 美食 饭店 餐饮行业 美食行业

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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