-
响应式设计优缺点查看全部
-
media="only screen and(max-width:480px)" @media screen and(min-width:480px){body{bakground:blue;}}查看全部
-
CSS3 Media Query 常见属性: device-width，device-height--屏幕宽高（物理上的） width，height--渲染窗口宽高（实际窗口宽高） orientation 设备方向（横屏竖屏） resolution 设备分辨率查看全部
-
外联和内联css样式查看全部
-
...查看全部
-
<link rel="stylesheet" href="link.css" media="only screen and (max-width:480px)" />查看全部
-
CSS3 - Media Query 常见的属性： * device-width,device-height——屏幕宽高 * width,height ——渲染窗口宽高 * orientation ——设备方向 * resolution ——设备分辨率查看全部
-
栅格系统（列布局）查看全部
-
bootstrap框架查看全部
-
http://v3.bootcss.com/examples/offcanvas/查看全部
-
响应式布局之Bootstrap CSS和组件 栅格系统 http://getbootstrap.com/css/#grid 组件 http://getbootstrap.com/components/#navbar 组建是自带CSS样式的，需避免样式重复查看全部
-
响应式布局之bootstrap 1、Bootstrap重要特征 一套完整基础的CSS插件 丰富的预定义样式表 一组基于jQuery的JS插件集 崇尚移动(Mobile First)先行，非常灵活的响应式(Responsive)栅格系统 2、Bootstrap官网: www.getbootstrap.com 或 直接在GitHub网站上在线阅读源码，目录分别是js和less ---- http://github.com/twbs/bootstrap 3、HTML标准模板 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 默认情况下，UI布局的宽度和移动设备的宽度一致，缩放大小为原始大小 <!- -bootstrap - -> <link href="css/bootstrap.min.css" rel="stylesheet"> <!- -以下2个插件是用于在IE8支持HTML5元素和媒体查询的，不用可移除- -> <!- - Respond.js不支持file://方式访问- -> <!- -[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/htmlsshiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/reapond.min.js"></script> <![endif]- -> <!- -如果使用Bootstrap的JS插件，则必须引入jQuery- -> <script src="https://code.jquery.com/jquery.js"></script> <!- - Bootstrap的js插件- -> <script src="js/bootstrap.min.js"></script>查看全部
-
CSS3 - Media Query 1、常用属性 device-width，device-height : 屏幕宽高(设备的物理宽高) width,height:渲染窗口宽高（可视区域） orientation：设备方向（为用户设定不用的网页展示方式，竖屏横屏） resolution：设备分辨率 2、简单demo 外联css样式 — 当屏幕分辨率小于或等于480px时，body显示红色。 <link rel="stylesheet" href="css/link.css" media="only screen and (max-width:480px)"/> 内联css样式 — 当屏幕分辨率大于480px时，body显示蓝色。 <style type="text/css"> @media screen and (min-width:480px){ body{ background:blue; } } </style>查看全部
-
实现响应式布局的三种方式 1、CSS3 - Media Query（推荐使用，不能满足传统的pc端访问网站的需求，但能满足大多数的需求） 2、原生的Javascript （成本高，不推荐使用） 3、第三方开源框架 （推荐使用，可以很好的支持浏览器响应式布局的设计）查看全部
-
响应式设计的原则 1、移动优先： 从响应式布局的诞生就决定设计的初期就是考虑的页面是怎么在多终端展示的 2、渐进增强 充分发挥硬件设备的最大功能 某些属性和功能并不受低版本的IE浏览器支持，但不能不使用某些属性和功能。查看全部
举报
0/150
提交
取消