wed开发,导航设计案例

原创 2018-11-09 13:16:29 3
摘要:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>成都朗煜工装公司-专业的办公室、店铺、酒店、网咖装修公司</title> <link rel="shortcut icon"
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>成都朗煜工装公司-专业的办公室、店铺、酒店、网咖装修公司</title>
<link rel="shortcut icon" type="image/x-icon" href="http://www.cdlyzs.com/favicon.ico">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/layui/css/layui.css">
<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
<script src="css/layui/layui.js"></script>
</head>
<body>
<div>
  <div>
<div>
    <p>欢迎你访问朗煜官网、有什么疑问请咨询在线客服</p>
</div>
   </div>
</div>
<div>
<div><img src=" http://www.cdlyzs.com/skin/images/logo.png " alt=""></div>
<div><i></i><div> <p>028-83177822</p><em>全国免费咨询电话</em></div></div>
</div>
<div>
<div>
<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>
<li><a href="#">网站导航</a></li>
<li><a href="#">网站导航</a></li>
<li><a href="#">网站导航</a></li>
</ul>
<button>在线免费咨询</button>
</div>
</div>
<div id="test1">
      <div carousel-item>
     <img src="http://www.cddrzs.com/uploadfile/2018/1016/20181016034816183.jpg" alt="">
     <img src="http://www.cdlyzs.com/uploadfile/2017/1115/20171115025558888.jpg" alt="">
     <img src="http://www.cdlyzs.com/uploadfile/2017/1115/20171115025558888.jpg" alt="">
      </div>
    </div>
<script>
layui.use('carousel', function(){
  var carousel = layui.carousel;
  //建造实例
  carousel.render({
    elem: '#test1'
    ,width: '100%' //设置容器宽度
    ,height: '500px'//设置容器高度
    ,arrow: 'always' //始终显示箭头
    //,anim: 'updown' //切换动画方式
  });
});
</script>
</body>
</html>

QQ截图20181109131428.png

批改老师:灭绝师太批改时间:2018-11-09 17:36:09
老师总结:导航布局很规范, 以后就是这样,配图 就好多了

发布手记

热门词条