移动布局方案(转载)

layout viewport和visual viewport移动端浏览器和PC最大的不同在于大小(废话= =),那么怎样让网页友好的展示在移动端呢。很显然的,如果不做任何处理,很多页面的展示必然会乱掉。Apple也发现了这个问题,并定义了一个viewport meta标签,用来创建一个虚拟的**layout viewport**(布局视图),这个视图的分辨率接近pc,Apple将其定义为**980px**,其他厂商可能不同,感兴趣的可以自己写页面测试下。这就很好的解决了早期的页面在手机上显示的......

响应式设计笔记

HTML 4和CSS 2目前支持为不同的媒体类型设定专有的样式表。比如,一个页面在屏幕上显示时使用无衬线字体,而在打印时则使用衬线字体。screen和print是两种已定义的媒体类型。媒体查询让样式表有更强的针对性,扩展了媒体类型的功能。下面的css是应用在宽度小于等于960px的屏幕上:@media screen and (max-width: 960px) {     body { background-color: red; } } 此外,......