2013年8月23日
摘要: 我们了解了响应式Web设计的概念、组成要素以及基本的实现思路。今天继续相关话题,我们将从前文介绍过的“弹性布局结构”这方面出发,通过一个具体的实例来深入学习。如今的屏幕分辨率,小至320px(iPhone),大到2560px甚至更高(大显示器),变化范围极大。除了使用传统的台式机,用户会越来越多的通过手机、上网本、iPad一类的平板设备来浏览页面。这种情况下,固定宽度的设计方案将会显得越发不合理。页面需要有更好的适应性,其布局结构要做到根据不同的设备及屏幕分辨率进行响应调整。接下来,我们将了解一下怎样通过HTML5和CSS3 Media Queries(媒介查询)相关技术来实现跨设备跨浏览器的 阅读全文
posted @ 2013-08-23 18:30 李东振 阅读(333) 评论(0) 推荐(1) 编辑
摘要: 在设计中经常遇到这几个问题:1.想要网站兼容手机、平板电脑、pc,就得为不同的设备定制不同的版本。2.想要网站的某些页面在宽屏显示器下一行显示更多的内容,又得为宽屏定制一个版本。3.很多人并不是在全屏的情况下浏览我们的页面,如果让页面随着浏览器宽度改变而相应的调整会不会比较好?有没有办法能有效解决这些问题呢?响应式Web设计(Responsive Web design)的理念是页面的设计与开发应当根据设备环境(屏幕尺寸、屏幕定向、系统平台等)以及用户行为(改变窗口大小等)进行相应的响应和调整。具体的实践方式由多方面组成,包括弹性网格和布局、图片、CSS media query的使用等。无论用户 阅读全文
posted @ 2013-08-23 18:21 李东振 阅读(273) 评论(0) 推荐(1) 编辑