响应式设计代码(小技巧)

1、媒体查询,包含将帮助您快速开始自己的多屏幕网站开发的示例。

2、前5项功能(width、height、device-width、device-height和orientation)是最有用的。

3、为移动电话、平板电脑和桌面计算机提供不同的式样

4、添加带有这些设置的视口<meta>标签能够确保智能手机和平板电脑遵守媒体查询中的宽度设置。 此外,将初始数值设置为1也能够确保iPhone、iPad和Pod touch在横向正确地应用宽度设置。

5、省略高度使得你能够在较小的屏幕上将图像缩小而不会产生失真现象。

6、当为移动设备进行设计时,针对字体大小,推荐使用百分比。

原文地址:https://www.cnblogs.com/Greenzgz/p/4131001.html