响应式布局
文章平均质量分 74
红人日天
天津商业大学计算机科学与技术专业本科在读
展开
-
移动Web开发——响应式布局(完结)、阿里百秀首页实战
响应式布局(完结) 因为网页实在是访问不了,所以直接用现有的素材做了。 1.技术选型 方案:采取响应式页面开发方案 技术:bootstrap框架 设计图:采取1280px设计尺寸原创 2021-03-03 21:33:17 · 1080 阅读 · 3 评论 -
移动Web开发——响应式布局(二)
响应式布局(二) 学习目标 (1)能够说出响应式原理 (2)能够使用媒体查询完成响应式导航 (3)能够使用 bootstrap 的栅格系统 (4)能够使用 bootstrap 的响应式工具 (5)能够独立完成阿里百秀首页案例 1.bootstrap使用(只用样式库) 控制权在框架本身,使用者要按照框架所规定的某种规范进行开发 bootstrap 使用四个步骤:1. 创建文件夹结构 2. 创建 html 骨架结构 3. 引入相关样式文件 4. 书写内容 (1)bootstrap下载 下载地址https://原创 2021-03-03 14:33:48 · 433 阅读 · 0 评论 -
移动Web开发——响应式布局(一)
响应式布局(一) 学习目标 (1)能够说出响应式原理 (2)能够使用媒体查询完成响应式导航 (3)能够使用 bootstrap 的栅格系统 (4)能够使用 bootstrap 的响应式工具 (5)能够独立完成阿里百秀首页案例 1.响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的。 设备划分 尺寸区间 超小屏幕(手机) < 768px 小屏设备(平板) >= 768px ~ < 992px 中等屏幕(桌面显示器) >原创 2021-03-02 16:24:46 · 1729 阅读 · 0 评论