实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="http://ceshi.itx17.cn/static/css/header.css"> <link rel="stylesheet" href="http://ceshi.itx17.cn/static/css/footer.css"> <link rel="stylesheet" href="http://ceshi.itx17.cn/static/css/index.css"> <link rel="stylesheet" href="http://ceshi.itx17.cn/static/css/about.css"> <title>首页</title> </head> <body> <!-- 头部 --> <div class="header"> <div class="content"> <ul class="nav"> <li class="item"><a href="http://ceshi.itx17.cn/index.html">首页</a></li> <li class="item"><a href="http://ceshi.itx17.cn/news.html">公司新闻</a></li> <li class="item"><a href="http://ceshi.itx17.cn/products.html">最新产品</a></li> <li class="item"><a href="http://ceshi.itx17.cn/about.html">关于我们</a></li> <li class="item"><a href="http://ceshi.itx17.cn/contact.html">联系我们</a></li> </ul> </div> </div> <!-- 中间主体 --> <div class="container"> <!-- banner图--> <div class="banner"> <img src="http://ceshi.itx17.cn/static/images/banner.jpg" alt=""> </div> <!-- 1. 中间内容区块 --> <div class="wrap"> <div class="main"> <div class="list-img"> <h3>公司产品</h3> <ul> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> </ul> <ul> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> </ul> <ul> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> </ul> <ul> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> <li class="item"><a href=""><img src="http://ceshi.itx17.cn/static/images/product.png" alt="" width="200"></a></li> </ul> </div> </div> </div> <!-- 2. 左侧分为上下二 --> <div class="left"> <!-- 公司简介:图文混排--> <div class="text-img"> <h3>公司简介</h3> <img src="http://ceshi.itx17.cn/static/images/gsjs.jpg" alt="" width="150"> <p> 我公司生产的显示器, 不能当饭吃, 也不能当衣服穿, 并且全部都是方的, 只要通上电, 就可以使用了 每一台显示器, 都带了一根电源线, 还有一根信号线, 出厂的时候, 没有配插线板, 需要 用户自己***一下, 实在是不好意思了, 毕竟9块9就包邮了(***PDD商城哟) </p> </div> <!-- 联系我们--> <div class="contact"> <h3>联系我们</h3> <dl> <dt>电话:</dt> <dd>+86-010-56778899</dd> <dt>手机:</dt> <dd>+86-13801090876321</dd> <dt>地址:</dt> <dd>北京市通州区京沈高速旁</dd> <dt>微信:</dt> <dd>与手机同号</dd> </dl> </div> </div> <!-- 3. 右侧边栏区块 --> <div class="right"> <div class="news-list"> <h3>公司新闻</h3> <ul> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> <li class="item"><a href="">恭喜公司新官网正式上线啦...</a></li> </ul> </div> </div> </div> <div id="main" class="guanyu"> <h1>关于我们</h1> <div class="box"> <p>途牛旅游网创立于2006年10月，2014年5月登陆美国纳斯达克，是美股***第一支专注于在线休闲旅游的中国公司。</p> <p>得益于中国在线休闲旅游***的高速发展以及客户的广泛支持，自2015年第四季度以来，途牛一直位居中国在线休闲旅游***份额第一。</p> <p>截至2018年年底，途牛合作旅游服务供应商逾16500家，可以为消费者提供的跟团和自助等打包旅游产品超过220万种，还有丰富的机票、酒店、签证等单项旅游产品。</p> <p>截至2019年3月，途牛累计服务超过1.08亿人次出游，共获得客户点评600多万条，产品综合满意度达到93%。</p> </div> <div class="box"> <h3>途牛旅游网徐庄软件园总部大厦</h3> <p><img src="http://img1.tuniucdn.com/u/zt/tuniudasha/tuniudasha.jpg" alt="途牛旅游网徐庄软件园总部大厦" /></p><br /> </div> <!-- 底部 --> <div class="footer"> <div class="content"> <p> <a href="">© PHP中文网版权所有</a> | <a href="">0551-88889999</a> | <a href="">皖ICP2016098801-1</a> </p> </div> </div> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
