bootstrap
eclipse
进行页面开发，最头疼的问题在于：页面写完了，发现换个浏览器不支持了（显示风格瞬间改变）。什么是栅格系统？
栅格布局样式定义：
如果要真想实现栅格，那么就必须有一个可以容纳多个栅格的行，而多个栅格行最终就组成了一个页面。在整个bootstrap之中最多只能够存在12栅格，不管你怎样定义，最终别超过12个就可以了，可以少，但是不能多。
如果现在是一个宽容器的窗口，那么整个栅格都会按照宽屏幕的方式完成显示，而到了窄屏页面，那么会自动改变显示的风格。栅格布局的实现：如果要想实现栅格布局，只要通过四个样式完成的：col-lg-*(大型设备)，col-md-*(中型设备)，col-sm-*(小型设备),col-xs-*(极小型设备)。不同的样式主要应该在不同的屏幕宽度上。但是问题是，我们如何确定要使用何种栅格呢？我一直强调会由bootstrap自动检测。
这些媒体宽度决定使用不同的容器(.container),所有的栅格一定要建立在容器之中。
栅格使用要求如下图：
为了更好的理解，下面实现一个简单的栅格操作：<%@ page language='java' contentType='text/html; charset=UTF-8' pageEncoding='UTF-8'%><%@taglib uri='http://java.sun.com/jsp/jstl/core' prefix='c' %><% pageContext.setAttribute('APP_PATH',request.getContextPath());%>
运行程序，查看运行结果。此时可以发现，栅格会根据屏幕宽度的改变，而自动的进行排版。
利用栅格实现下面的效果：栅格跨列，如果你需要跨列，那么就写多少个列。<%@ page language='java' contentType='text/html; charset=UTF-8' pageEncoding='UTF-8'%><%@taglib uri='http://java.sun.com/jsp/jstl/core' prefix='c' %><% pageContext.setAttribute('APP_PATH',request.getContextPath());%>
列偏移介绍。使用列偏移：<%@ page language='java' contentType='text/html; charset=UTF-8' pageEncoding='UTF-8'%><%@taglib uri='http://java.sun.com/jsp/jstl/core' prefix='c' %><% pageContext.setAttribute('APP_PATH',request.getContextPath());%>
除了可以进行整体栅格操作（代码之中需要清除的是栅格就相当于一个表格），所以栅格依然是可以嵌套的。
栅格嵌套：