纯CSS最小响应网格布局

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最小响应网格布局

最新文章

热门文章