首页 >web前端 >css教程 >css响应式布局是什么

css响应式布局是什么

一个新手
一个新手原创
2017-09-09 13:29:521801浏览

起因    因为越来越多的智能移动设备( mobile, tablet device )加入到互联网中来,移动互联网不再是独立的小网络了,而是成为了 Internet 的重要组成部分。响应式网络设计 ( RWD / AWD)的出现,目的是为移动设备提供更好的体验,并且整合从桌面到手机的各种屏幕尺寸和分辨率,用技术来使网页适应从小到大(现在到超大)的不同分辨率的屏幕。
: Responsive Web Design = RWD,Adaptive Web Design = AWD,下同设计
RWD:采用 CSS 的 media query 技术
流体布局( fluid grids )
自适应的图片/视频等资源素材
(为小、中、大屏幕做一些优化,目的是让任何尺寸的屏幕空间都能得到充分利用)
AWD: CSS media query 技术(仅针对有限几种预设的屏幕尺寸设计)
用 Javascript 来操作 HTML 内容
在服务器端操作 HTML 内容(比如为移动端减少内容,为桌面端提供更多内容)
设计思路 Mobile First(从移动端开始,RWD ):一切从最小屏幕的手机端开始(比如 iPhone 的 320px ),先确定内容,然后逐级往大屏幕设计。不同于原来网页设计,总是从桌面电脑的 1024px 开始的。

以上是css响应式布局是什么的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn