响应式的设计需要遵守的4个原则和媒介查询语句

1，小屏幕只显示高优先级的内容（切换到小屏幕的时候，显示优先级高的内容）

2，提供清晰和友好的手指操作链接（可点击操作的区块不宜过小）

3，体验的一致性（不同设备上的保持一致性）

4，考虑操作移动设备的习惯（左手握住设备，右手操作）

媒介查询的基本语法：

（1）定义小于600px的窗口所应用的样式

　@media screen and (max-width:600px){

　　　.class{

　　　　　　background:#ccc;

　　　　}

　　}

（2）定义小于900px并且大于600px的窗口所应用的样式

　@media screen and (min-width:600px) and (max-width:900px){

　　　.class{

　　　　　　background:#ccc;

　　　　}

　　}