1 Star 1 Fork 0

王子秋/响应式布局

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
news.html 7.91 KB
一键复制 编辑 原始数据 按行查看 历史
王子秋 提交于 2020-12-09 16:17 . 响应式布局
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>新闻</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/common.css">
<link rel="stylesheet" href="css/news.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
</head>
<body>
<div class="header wow fadeInDown">
<div class="c">
<div class="header-c-top">
<div class="header-logo crl">
</div>
<ul class="nav crl">
<li class="nav-item crl">
<a href="index.html">首页</a>
<span></span>
</li>
<li class="nav-item crl">
<a href="item.html">项目</a>
<span></span>
</li>
<li class="nav-item crl">
<a href="protect.html">产品</a>
<span></span>
</li>
<li class="nav-item crl">
<a href="serve.html">服务</a>
<span></span>
</li>
<li class="nav-item crl fontSizeBig">
<a href="news.html">新闻</a>
<span></span>
</li>
<li class="nav-item crl">
<a href="about.html">关于</a>
<span></span>
</li>
</ul>
<a href="javascript:" class="header-top-trantion">
<span></span>
<span></span>
<span></span>
</a>
</div>
<ul class="header-c-mask">
<li class="header-c-mask-crl">
<a href="index.html">首页</a>
<span></span>
</li>
<li class="header-c-mask-crl">
<a href="item.html">项目</a>
<span></span>
</li>
<li class="header-c-mask-crl">
<a href="protect.html">产品</a>
<span></span>
</li>
<li class="header-c-mask-crl">
<a href="serve.html">服务</a>
<span></span>
</li>
<li class="header-c-mask-crl">
<a href="news.html">新闻</a>
<span></span>
</li>
<li class="header-c-mask-crl">
<a href="about.html">关于</a>
<span></span>
</li>
</ul>
</div>
</div>
<div class="header-mask"></div>
<div class="news">
<div class="c">
<div class="top">
<p>
您的位置:新闻
</p>
<div class="img">
</div>
<p class="bottom">
新闻资讯
</p>
</div>
<div class="center">
<div class="news-right">
<div class="text">
<div class="title">
<p class="left">
看得到的品质,看不到的用心!
</p>
<p class="right">
06-11
</p>
</div>
</p>
<p class="bottom">
专注品质,从现代生活崇尚简约大气的角度出发,家具不仅仅是一件家具这么简<br>
单,更是一件工艺品的象征。
</p>
</div>
<div class="text">
<div class="title">
<p class="left">
TAOLIVING整体家居 低调都市风。
</p>
<p class="right">
06-14
</p>
</div>
</p>
<p class="bottom">
东南亚风格明显的MANILA系列家具,因“自然原材 传承工艺”的独特气质,成为<br>
TAOLIVING整体家居的品鉴之作。如果搭配得当,则能巧妙地营造出低调。
</p>
</div>
<div class="text">
<div class="title">
<p class="left">
传统经典的美式造型,简约沙发!
</p>
<p class="right">
06-20
</p>
</div>
</p>
<p class="bottom">
好看的布料可以很实用,实用的布料也可以很美观!白色窗帘就是这样的布料。<br>
大家都知道它的功能是遮光挡风,但是松松地在尾部打个结,就可以得到意想不<br>
到的效果。
</p>
</div>
<div class="text">
<div class="title">
<p class="left">
家居消费高峰期 注意提防甲醛超标。
</p>
<p class="right">
06-28
</p>
</div>
</p>
<p class="bottom">
尽管家具合格率逐年上升,但甲醛释放量超标依然是排在家居行业不合格产品问<br>
题中的首要难题。
</p>
</div>
<div class="text">
<div class="title">
<p class="left">
小空间大运用 衣柜驻家有术。
</p>
<p class="right">
06-11
</p>
</div>
</p>
<p class="bottom">
嫌您的卧室四面都是墙壁过于单调?衣柜太大霸占空间?让你的衣柜“钻”进墙内吧!<br>
建议正方形更衣间,可设计为U字形柜体,完全贴合壁面。
</p>
</div>
</div>
<div class="news-left">
<div class="img img1"></div>
<div class="img img2"></div>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="c">
<ul class="fot-nav">
<li class="nav-item mf">
<div class="all">
<p>
简设装饰有限公司
</p>
<div class="span ">
<img src="img/index/about/xinlang.png" alt="">
<img src="img/index/about/xinlang.png" alt="">
<img src="img/index/about/qq.png" alt="">
</div>
</div>
</li>
<li class="nav-item mr0">
</li>
<li class="nav-item">
<p>
地址:中国地区**分区6号写字楼888室
</p>
<p>
电话:688-8888-008
</p>
<p>
传真:000-66668888
</p>
</li>
<li class="nav-item mr0"></li>
<li class="nav-item mb">
<p>
邮编:100000
</p>
<p>
手机:186-6006-8008
</p>
<p>
邮箱:00060008@163.com
</p>
</li>
</ul>
</div>
</div>
<div class="realfooter">
<p class="h">简设装饰有限公司</p>
<div class="realfooter-top ">
<span><img src="img/index/about/xinlang.png" alt=""></span>
<span><img src="img/index/about/qq.png" alt=""></span>
<span><img src="img/index/about/weixin.png" alt=""></span>
</div>
<div class="realfooter-mid">
<p>地址:中国地区**分区6号写字楼888室</p>
<p>电话:688-8888-008</p>
<p>传真:000-66668888</p>
</div>
<div class="realfooter-bottom">
<p>邮编:100000</p>
<p>手机:186-6006-8008</p>
<p>邮箱:00060008@163.com</p>
</div>
</div>
<script src="js/jquery.js"></script>
<script src="js/swiper-master/package/swiper-bundle.min.js"></script>
<script src="js/common.js"></script>
<script src="js/wow.js"></script>
<script>
new WOW().init();
</script>
</body>
</html>
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
1
https://gitee.com/feng-suo/responsive-layout.git
git@gitee.com:feng-suo/responsive-layout.git
feng-suo
responsive-layout
响应式布局
master

搜索帮助

0d507c66 1850385 C8b1a773 1850385