-
bootstrap必须加入此meta标签查看全部
-
<link type="text/css" rel="stylesheet" href="../static/css/bbb.css" media="only screen and (max-width:480px)"> <style> @media screen and (min-width:480px){ body{background: yellowgreen;} } </style>查看全部
-
...查看全部
-
css3-media Query：常见属性查看全部
-
rel 属性规定当前文档与被链接文档之间的关系。查看全部
-
响应式布局之bootstrap框架： 1、是一种移动优先的前端框架；不仅可以帮助解决低端浏览器不支持css3的问题，同时解决了不同分辨率上网页布局的展示 2、优点：写非常少的代码，即可实现多终端的页面适配； 3、源文件主要有两部分构成，即CSS,JS和font字体； 4、bootstrap的源代码是Less文件，不改变源代码的情况下可以直接下载编译后的文件； 5、几乎支持所有浏览器，对于IE8/9需要引入Respond.js文件激活IE8/9对Media Query的支持； 6、最好把respond.js和网站部署在同一个域名下，避免出现跨域问题查看全部
-
bootstrap的搭建 必须要有个meta标签 initial-scale：默认缩放，用于展示网页的设备的合适范围大小 还有一个respond的问题查看全部
-
CSS3-Media Query 内嵌语法。 当屏幕的宽度大于480px时 的css语句查看全部
-
外联样式表查看全部
-
CSS3-Media Query 外联语法。 当屏幕宽度小于等于480px时 的css语句查看全部
-
响应式设计优缺点查看全部
-
属性device-width，device-height，orientation，resolution查看全部
-
想要实现页面原有的效果样式，必须引入相关的样式表，在添加相对的容积查看全部
-
重点}响应式布局之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>查看全部
-
CSS Media Quary常见属性 device-width,device-height—设备宽高 width,height-渲染窗口宽高 orientation-设备方向 resolution-设备分辨率查看全部
举报
0/150
提交
取消