-
内联响应式布局：@media screen and (min width:480px);当浏览器可视区域大于480px样式启用 外联响应式布局：media="only screen and (max width:480px)" 当浏览器可视区域小于480px样式启用查看全部
-
device-width:设备宽 device-height设备高 width：渲染窗口宽度 height：渲染窗口高度 orientation：设备方向 resolution：设备分辨率查看全部
-
响应式布局： device-width，device-height 屏幕宽高（物理宽高） orientation 设备方向 resolution 设备分辨率查看全部
-
device-width device-height 屏幕的宽高 width height 渲染窗口的宽高查看全部
-
media query 常见的属性查看全部
-
如何实现查看全部
-
响应式设计的原则查看全部
-
响应式的优缺点查看全部
-
服务器端根据不同的浏览器客户端，在浏览器中为用户 呈现不同的网页页面查看全部
-
Bootstrap本身提供了现成的组件和结构，对组件进行改造，即可达到预期效果 Bootstrap核心是：栅格化布局，需要着重掌握！ 注意：Bootstrap高度组件化，使用时不要尝试重新开发查看全部
-
Bootstrap CSS框架 1.Grid system：栅格系统，即为列布局 .col-xs- 极小设备 <768px Auto .col-sm- 小型设备 >=768px 单元格最大宽度：60px .col-md- 中型设备 >=992px 单元格最大宽度：78px .col-lg- 大型设备 >=1200px 单元格最大宽度：95px 如果.col-sm-后面的数字为8(.col-sm-8),那么单元格最大宽度为480px 必须条件： ①"行"必须放在.container的class容器中,内容必须放在单元格中，单元格必须是"行"的子元素 ②Bootstrap提供了一些快速制作栅格系统预制的class，例如：row ③为了更好的展示效果，可以引入CSS样式<link href="docs-assets/css/docs.css"> 2.Buttons 按钮：提供了一些内置样式，可以根据样式定制按钮 ①.btn-lg 大按钮 ②.btn-sm 中按钮 ③.btn-xs 小按钮 3.Bootstrap提供了很多插件 导航：Page header 、Navbar 注意：组件本身带有Class样式，需避免样式冲突查看全部
-
移动优先的前端框架：Bootstrap 优点：写非常少的代码，即可实现多终端的页面适配 注意：class命名不能和Bootstrap原有的命名冲突 ①bootstrap主要有两个文件：一个是css（处理布局），一个事js（用来处理事件）。IE8等低端浏览器不支持css3样式，需要引入respond.js ②respond.js和网站部署在同一个域名下，可以避免跨域问题 ③必须设置meta标签：<meta name="viewport" content="width=device-width,initial-scale="1.0">，initial-scale="1.0"表示默认网页时不进行缩放的 ④引入Bootstrap中CSS文件 ⑤使用if判断引入respond.js <script src="http://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> ⑥引入jquery和bootstrap文件，先引入jq因为有bootstrap对jq有依赖查看全部
-
CSS3-Media Query常见属性： ①device-width 、device-height：屏幕宽高 ②width 、height：渲染窗口宽高(浏览器实际大小) ③orientation：设备方向 ④resolution：设备分辨率 基本语法： ①外联CSS语法 <link media="only screen and (max-width:480px)"...>当屏幕<=480，引用css样式 ②内嵌样式语法 <style> @media screen and (min-width:480px){ 屏幕大于480时显示这个效果 body{ background: bluel; } } </style>查看全部
-
实现响应式布局的3种方法 ①通过CSS3提供的Media Query(最简单的方式) ②不支持CSS3提供的Media Query，借助原生的Javascript(成本高，不推荐使用) ③第三方的开源框架，如Bootstrap(可以很好的支持浏览器响应式布局设计)查看全部
-
响应式设计原则： ①移动优先：在设计初期就要考虑到页面如何在多终端展示 ②渐进增强：充分发挥硬件设备的最大功能查看全部
举报
0/150
提交
取消