欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

css响应式布局是什么

程序员文章站 2022-04-19 16:01:12
...
起因 因为越来越多的智能移动设备( 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响应式布局是什么的详细内容,更多请关注其它相关文章!