灰色扁平风格的室内地毯公司企业网站源码下载



4 14 5



模板描述:灰色扁平风格 室内地毯公司 企业网站,灰色扁平风格的室内地毯公司企业网站源码下载html模板下载

代码结构

1. 引入CSS

<link href="css/style.css" rel="stylesheet" type="text/css" />

2. 引入JS

<script src="js/jquery.min.js"></script>
<script src="js/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="js/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="js/jquery.pikachoose.min.js"></script>
<script type="text/javascript" src="js/jquery.touchwipe.min.js"></script>
<script type="text/javascript" src="js/zzsc.js"></script>

3. HTML代码

<!--top-->
<div class="top_bg"></div>
<!--nav-->
<div class="nav_bg clearfix w100">
 <div class="wrap">
 <!--left-->
  <div class="menu"> 
<ul> 
<li>
 <a class="hide" href="#">
  首页
  <p>Home</p>
</a>
</li>
<li>
 <a class="hide" href="#">
  关于我们
  <p>About Us</p>
</a>
</li>
<li>
 <a class="hide" href="#">
  产品中心
  <p>Product</p>
</a>
</li>
<li>
 <a class="hide" href="#">
  精彩案列
  <p>Case</p>
</a>
</li>
<li>
 <a class="hide" href="#">
  新闻中心
  <p>News</p>
</a>
</li>
<li>
 <a class="hide" href="#">
  在线留言
  <p>Message</p>
</a>
</li>
<li>
<a class="hide" href="#">加入我们<p>Join Us</p></a> 
<!--[if lte IE 6]> 
<a href="../menu/index.html">DEMOS 
<table><tr><td> 
<![endif]--> 
<ul> 
<li><a href="../menu/zero_dollars.html" >招商加盟</a></li> 
<li><a href="../menu/embed.html">社会招聘</a></li>
<li><a href="../menu/embed.html">校园招聘</a></li>
</ul> 
<!--[if lte IE 6]> 
</td></tr></table> 
</a> 
<![endif]--> 
</li> 
<li>
<a class="hide" href="#.html">联系我们<p>Contact Us</p></a> 
<!--[if lte IE 6]> 
<a href="index.html">MENUS 
<table><tr><td> 
<![endif]--> 
</li> 
</ul> 
<!-- clear the floats if required --> 
</div> 
<!--right-->
<ol class="fr pt13">
 <a href="#"><img src="images/index1_r3_c15.jpg" /></a>
</ol>
</div>
</div>
<!--js-->
<div class=" clearfix overflow w100">
<!-- 代码begin -->
<div class="flexslider">
	<ul class="slides">
		<li style="background: url(images/index1_r9_c1.jpg) 50% 0 no-repeat;"></li>
		<li style="background:url(images/index1_r9_c1.jpg) 50% 0 no-repeat;"></li>
		<li style="background:url(images/index1_r9_c1.jpg) 50% 0 no-repeat;"></li>
	</ul>
</div>
<!-- 代码end -->
<script>
$(function(){
	$('.flexslider').flexslider({
		directionNav: true,
		pauseOnAction: false
	});
});
</script>
</div>
<!--关于我们和案例-->
<div class="wrap overflow clearfix pt20">
 <!--关于我们-->
 <div class="w535 fl overflow">
  <div class="w535_top overflow">
   <p class="fl f18 pl40 l-35">关于我们</p>
   <span class="fr l-35 pt10"><a href="3">更多+</a></span>
  </div>
  <div class="w100 clearfix pt10 overflow tl l-24 ">
   <img src="images/index1_r13_c3.jpg" class="fl mr10 pt5"  width="223" height="132"/>
   河南美可依地毯有限公司,系一家专业生产高品
质的地毯生产厂家。注册商标《美依》。营销中
心位于郑州市惠济区花园路英才街。生产地址位
于河南省原阳县产业区。
我公司自2013年转型以来,已发展成为集服务、
设计、生产、销售于一体的大型广告地毯生产
销售于一体的大型广告地毯生产企业。营销网络遍布国内外各地。旗下自有地毯厂,印刷
厂,绣花厂,无纺布厂,礼品公司等,主要产品有:圈绒提花广告地毯,圈绒拼色提花
广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,亚麻广告地垫,促销广告礼品,商
务广告礼品等.企.........
  </div>
 </div>
 <!--精彩案例-->
 <div class="w535 fr overflow">
  <div class="w535_top overflow">
   <p class="fl f18 pl40 l-35">精彩案例</p>
   <span class="fr l-35 pt10"><a href="3">更多+</a></span>
  </div>
  <div class="w100 clearfix pt10 overflow  ">
<div class="pikachoose">
    <ul id="pikame" class="jcarousel-skin-pika">
        <li><a href="http://www.51qianduan.com/" target="_blank"><img src="images/1.jpg"/></a><span>This is an example of the basic theme.</span></li>
        <li><a href="http://www.51qianduan.com/" target="_blank"><img src="images/2.jpg"/></a><span>jCarousel is supported and can be integrated with PikaChoose!</span></li>
        <li><a href="http://www.51qianduan.com/" target="_blank"><img src="images/3.jpg"/></a><span>Be sure to check out <a href="http://www.51qianduan.com/">PikaChoose.com</a> for updates.</span></li>
        <li><a href="http://www.51qianduan.com/" target="_blank"><img src="images/4.jpg"/></a><span>You can use any type of html you want with PikaChoose</span></li>
        <li><a href="http://www.51qianduan.com/" target="_blank"><img src="images/5.jpg"/></a><span>PikaChoose survives on your donations! Keep the project alive with a donation.</span></li>
    </ul>
</div>
<script language="javascript">
$(document).ready(function (){
        $("#pikame").PikaChoose({carousel:true, carouselVertical:true});
});
</script>
  </div>
 </div>
</div>
<!--产品展示-->
<div class="pro_bg mt20 overflow clearfix">
  <a href="#"><img src="images/index1.png" class="mt15 overflow" /></a>
  <div class="wrap overflow bg_p mt5 ">
    <ul>
     <li>
      <a href="#">
      <img src="images/index1_r17_c10.jpg" />
      </a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
     <li>
      <a href="#"><img src="images/index1_r17_c10.jpg" /></a>
      <span><a href="#">产品分类</a></span>
     </li>
    </ul>
   </div>
</div>
<div class="clearfix bg_bot overflow">
 <img src="images/index1_r4_c4.jpg" />
</div>
<!--新闻-->
<div class="wrap overflow clearfix mt20">
 <img src="images/index1_r6_c4.jpg" />
</div>
 <!-- 代码 开始 -->
<div class="box">
	<div class="bleft">
		<div class="bcon">
		<!-- 代码结束 -->
			<ul class="list1">
				<li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯333厂有地毯333厂有地毯333厂有地毯333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
				<li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯333厂有地毯333厂有地毯333厂有地毯333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
               <li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯333厂有地毯333厂有地毯333厂有地毯333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
			</ul>
			<ul class="list1">
				<li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
                <li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯33厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
                <li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
			</ul>
            <ul class="list1">
				<li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
                <li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地333厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
                <li>
					<a href="#"><img src="images/index1_r19_c4.jpg" class="fl " /></a>
					<ol><a href="#">旗下自有地毯3厂有地毯333厂,印刷 厂,绣花厂</a><br />
      绒提花广告地毯,圈绒拼色提花 广告地毯,割绒地毯,家居毯 , 蹭蹭垫,拉绒广告地垫,</ol>
				</li>
			</ul>
            <h1><span id="list_mark"><em></em><em></em><em></em></span></h1>
		</div>
	</div>
    </div>
<!-- 代码 结束 -->
 <div class="wrap overflow clearfix pt15">
  <a href="#"><img src="images/index1_r13_c6.jpg" /></a>
 </div>
<!--版权-->
<div class="copy_bg w100 clearfix mt40">
 <div class="wrap overflow">
  <p class="fl"><img src="images/index1_r21_c4.jpg" /></p>
  <dl class="dl_w">
   <dt><a href="#"> 产品中心</a>&nbsp;     | &nbsp;     <a href="#"> 精彩案列</a>    &nbsp;  |  &nbsp;   <a href="#">   在线留言</a> &nbsp;     |  &nbsp;    <a href="#">  新闻中心 </a>  &nbsp;     |  &nbsp;    <a href="#">  加入我们   </a> &nbsp; &nbsp;    | &nbsp;   <a href="#">   网络销售</a> &nbsp;      |  &nbsp; &nbsp;    <a href="#"> 联系我们</a> </dt>
   <dd>
   河南美可依地毯有限公司 版权所有 @2016<br />
电话:0371—55038060、手机号18037683368、QQ联系方式:297359771<br />
公司地址: 郑州市惠济区英才街16号
   </dd>
  </dl>
  <ol class="fr ol_w">
   <img src="images/index1_r22_c16.jpg" />
   <span>
   关注我们<br />
   扫一扫
   </span>
  </ol>
 </div>
</div>



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


热门标签: 行业 企业 公司 工厂 分类 响应式 自适应 设备 风格 颜色 扁平化 企业 行业 公司 工厂 pc 电脑 普通自适应 html+css自适应 html+css响应式 灰色 简洁 简约 简单 装修装饰 装潢 装修 装饰

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

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

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