1.移除<head>头标签里的下面这行meta标签
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no" >2.，class="container"改为id或其他类名并添加宽度
#container { width: 960px; margin: 0 auto; }3.如果使用了导航条，需要移除所有导航条的折叠和展开行为。
添加类
class="clearfix"响应式图片会随着浏览器窗口的改变而等比例改变大小。 添加类
class="img-responsive"例如：
<div class="container"> <div class="row"> <div class="col-md-4"> <img src="img/slider1.jpg" alt="" class="img-responsive"> </div> </div> </div>p标签中文本对齐方式三种：
class="text-left" class="text-right" class="text-center"鼠标放上显示完整文字 如图：
去掉ul列表前面的圆点
class="list-unstyled"例如：
<ul class="list-unstyled"> <li>我是一个li</li> <li>我也是一个li</li> </ul>屏幕大于768px时，左边div…右边div… css样式：
<style> @media (min-width: 768px) { #left { width: 250px; height: 600px; /*margin-top: 50px;*/ position: absolute; z-index: 1; } #main { margin-left: 260px; /*margin-top: 50px;*/ } } </style>html:
<nav class="navbar navbar-default navbar-static-top"></nav> <div id="left"></div> <div id="main"></div>