輕量級超級簡單的element的layout柵格化佈局
基於element主題提取出來的. 輕量級超級簡單的element的layout柵格化佈局 在你使用了element框架時不需要使用這個框架 Layout 佈局 通過基礎的 24 分欄,迅速簡便地建立佈局。
使用
<head>
<link rel="stylesheet" href="cc-layout-simple.css">
</head>
<div title="基礎佈局">
<h3>基礎佈局</h3>
<p>使用單一分欄建立基礎的柵格佈局</p>
<div class="cc-row">
<div class="cc-col-24"><div class="demo-test bg-1"></div></div>
</div>
<div class="cc-row">
<div class="cc-col-12"><div class="demo-test bg-1"></div></div>
<div class="cc-col-12"><div class="demo-test bg-2"></div></div>
</div>
<div class="cc-row">
<div class="cc-col-8"><div class="demo-test bg-1"></div></div>
<div class="cc-col-8"><div class="demo-test bg-2"></div></div>
<div class="cc-col-8"><div class="demo-test bg-3"></div></div>
</div>
<div class="cc-row">
<div class="cc-col-6"><div class="demo-test bg-1"></div></div>
<div class="cc-col-6"><div class="demo-test bg-2"></div></div>
<div class="cc-col-6"><div class="demo-test bg-3"></div></div>
<div class="cc-col-6"><div class="demo-test bg-1"></div></div>
</div>
<div class="cc-row">
<div class="cc-col-4"><div class="demo-test bg-1"></div></div>
<div class="cc-col-4"><div class="demo-test bg-2"></div></div>
<div class="cc-col-4"><div class="demo-test bg-3"></div></div>
<div class="cc-col-4"><div class="demo-test bg-1"></div></div>
<div class="cc-col-4"><div class="demo-test bg-2"></div></div>
<div class="cc-col-4"><div class="demo-test bg-3"></div></div>
</div>
</div>
複製程式碼
演示地址
歡迎給星星謝謝了