访问Bootstrap3中文网
http://v3.bootcss.com/css/#responsive-utilities-tests
在“响应式工具”测试用例一节，你会看到这样一张图：


这张图是个什么意思呢？最开始我也是没看懂，等看明白了才感觉Bootstrap太牛B了。这图到底怎么看？很简单，把浏览器的右边框向左拖拽一小格，是不是变成下面这样了：


再拖拽一小格，这张图又变下面这样了：


浏览器边框再缩不小了，这时就是手机上显示的内容了：


神奇吧！感觉就象是javascript在操作一样，但你看一下源代码，会发现只有一个"bootstrap.min.css"被加载了，这就是Bootstrap3所说的CSS编程效果，真正实现了响应式设计，也就是浏览器自适应——随着终端设备的变化，浏览器可以自动调整页面布局和显示内容。

附件中是相关的源代码，下载下来自己看吧！
bootstrap.min.css是压缩格式
bootstrap.css是源文件
(完)

html.rar ( 38.32 KB 下载：6 次 )