响应式设计的一点儿基本概念
来源:互联网 发布:软件的技术特点 编辑:程序博客网 时间:2024/06/05 19:08
width是目前大多数浏览器所支持的唯一媒体特性,它也基本上是响应式设计目前所用到的唯一媒体特性。
1.关于断点:
断点是响应式设计的重要概念,我们可以用媒体查询在断点处改变布局设计,使设计产生两个(或更多)的变体。考量它的一个好办法是把所有可能的屏幕尺寸想象成一排,一端是最窄的屏幕,一端是最宽的屏幕。
如何选择断点?在一开始时最好不要只考虑页面设计在特定设备上的显示效果,而是应该从更通用的的访问设备,比如手机尺寸、平板电脑尺寸及桌面显示器尺寸去考虑它。**重要的是设计在每个设计范围中的显示效果,而不是在每个断点上的显示效果**
2.关于设计范围:
虽然断点十分重要,但他们只是代表了一小部分的视口宽度,而我们的设计应该在任何宽度下都有良好的显示效果,因此就要引入设计范围的概念了。所谓的设计范围实际上是指两个断点间所涵盖的屏幕尺寸范围。**各个设计范围获得各自不同的布局设计变体**
———- 构建响应式网站的最佳方式 —-渐进增强
渐进增强的理念是从最基本的开始,然后在此基础上为具有更强性能的浏览器和设备添加功能。默认设计是针对最小的屏幕,同时它也需要适应那些无法识别媒体查询,CSS3和JavaScript的设备。具体步骤如下:
- 从内容入手,以HTML定义其语义结构。
- 表现层,用CSS样式化页面上的内容。
- 行为层,用JavaScript实现。
核心理念:从最低标准开始,然后为每个人进行设计。
如何决定内容出现在页面上的位置?
使用网格系统,关于网格系统。网格系统是创建一个设计精良网页的关键
0 0
- 响应式设计的一点儿基本概念
- DAO层的一点儿设计细节
- 响应式图片的设计
- 响应式图片的设计
- 生活的更好一点儿
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- UIWindow的一点儿思考
- EditText的一点儿补充
- 3种web会话管理的方式
- 为什么要使用存储过程以及存储过程的优缺点
- 讲通一个小知识点---C语言三目运算符
- elasticsearch 口水篇(3)java客户端 - Jest
- mybatis配置
- 响应式设计的一点儿基本概念
- mysql source命令超大文件导入方法总结
- 11个最值得Java开发者收藏的网站
- 据说年薪30万的Android程序员必须知道的帖子
- log4qt的使用
- c++笔记(10):多态性(类属)、函数模板、类模板
- Nginx开发从入门到精通
- EIP——Spring Integration4.3使用篇
- 为什么要使用MapReduce?