<!DOCTYPE html> <html> <head> <style type="text/css"> .row{ width: 100%; height: 300px; padding:3px; } .col{ float: left; width: 100%; height: 100%; border: 1px solid #fff; box-sizing: border-box; background-color: #ccc; } @media (min-width: 768px) { .col{ width: 33.3%; } } </style> <title></title> </head> <body> <div class="row"> <div class="col"></div> <div class="col"></div> <div class="col"></div> </div> </body> </html>
58同城笔试题：在PC和平板中一行三列，在手机上一列三行。
主要知识点：媒体查询，栅格化
下图是bootstrap原生的栅格参数：
原文：http://www.cnblogs.com/hjy920124/p/5827327.html
