首页 > Web开发 > 详细

纯CSS最小响应网格布局

时间:2016-09-18 14:51:41      阅读:261      评论:0      收藏:0      [点我收藏+]

lemonade.css是一个超级小的CSS可以帮助你创建一个完全响应和灵活自如的网格布局,包括所需网页的头部。

技术分享

 

 

样式链接

<link rel= href=>

 

HTML结构这样创建一个多列网格布局:

<div class="frame">
  <div class="bit-1">
    <div class="box">1</div>
  </div>
</div>

<div class="frame">
  <div class="bit-2">
    <div class="box">1/2</div>
  </div>
  <div class="bit-2">
    <div class="box">1/2</div>
  </div>
</div>

<div class="frame">
  <div class="bit-3">
    <div class="box">1/3</div>
  </div>
  <div class="bit-3">
    <div class="box">1/3</div>
  </div>
  <div class="bit-3">
    <div class="box">1/3</div>
  </div>
</div>

 

 样品的CSS风格的格子

.box {
  text-align: center;
  background: #27ae60;
  color: #fff;
  padding: 15px 0 15px 0
}

  

纯CSS最小响应网格布局

原文:http://www.cnblogs.com/1v99/p/5881255.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!