![](https://img-blog.csdnimg.cn/7f0ccb6e874746d9a8a207552d34209f.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
响应式布局
文章平均质量分 51
总结分享一些自己在学习响应式布局内容时,觉得比较重要的点;以及给入门响应式布局的小伙伴们一个系统的知识清单。
AuroraJim
认真做好每一件事
展开
-
移动端开发(rem+flexbox项目实例总结)
移动端招聘项目首页总结一.项目效果、项目要求及工具使用二.项目文件一.项目效果、项目要求及工具使用项目效果:(第一板块导航)项目效果:(第二板块动态轮播)项目效果:(第三板块左右轮播)项目效果:(第四板块页脚)项目要求:页面适配ipad(786 ✖ 1024)像素以下所有设备,所有的图片文件像素大小均要符合UI设计师原图大小。工具使用(摹客):摹客官网一款能够测量原型图大小以及各元素颜色、像素的在线团队合作软件,开发者和UI设计师可以实时交互,探讨。二.项目文件...原创 2021-11-08 08:20:32 · 139 阅读 · 0 评论 -
响应式布局---基础知识
响应式布局---基础入门一. 媒体查询(@media)一. 媒体查询(@media)媒体查询的含义:根据不同设备屏幕大小来决定页面的样式(不限于布局、样式)需求:有一个div,要求在同一个页面根据不同的屏幕大小,来展示不同的样式效果。基本结构:<body> <!-- 概念:为不同屏幕尺寸设定不同的css的样式 --> <div id="dv"></div></body>style样式:<style>原创 2021-10-23 20:38:17 · 233 阅读 · 0 评论 -
响应式布局---深入概念
响应式布局一. 情景模拟,提出需求二. 开发探讨,技术筛选一. 情景模拟,提出需求概念项目经理说:“客户需要开发一套PC端和移动端的电商网站,任务已经分到你们手中了;小肖同学,你来带领大家完成开发哈”。思考假如是你,你会怎么办?方案分为两个小组PC端一套页面,移动端一套页面整个小组采用响应式布局设计,一套页面能够同时满足PC端和移动端的显示。(响应式布局概念)二. 开发探讨,技术筛选????经过大家一致讨论,最终选择了采用方案2,使用响应式布局方式开发可行型响应式布局方案采用百原创 2021-10-18 17:27:25 · 93 阅读 · 0 评论