本地在IE8浏览器下测试兼容性的时候,出现了以下的报错: 该问题在bootstrap的官网有介绍:https://v3.bootcss.com/getting-started…
1.0 为什么要做这个博客站? www.zynblog.com   在工作学习中,经常要搜索查找各种各样的资料,每次找到相关资料后都会顺手添加到浏览器书签中,时间一长,书签也就满了.而且下次再点击这个书签时,可能 就会忘记当时为什么要添加这个书签了,更有可能书签连接已经无效.这样一来,也就不方便自己查阅了.如果转载.收藏到自己的博客园账号中.CSDN账号 中,脚本之家中,知乎中等等,依然是很凌乱,不方便下次查阅. 因此,我下决心开发一个个人技术博客站.主要原因是:可以整合各种宝贵资源,将知识变为…
Metronic 是一套精美的响应式后台管理模板,基于强大的 Twitter Bootstrap 框架实现.Metronic 拥有简洁优雅的 Metro UI 风格界面,6 种颜色可选,76 个模板页面,包括图表.表格.地图.消息中心.监控面板等后台管理项目所需的各种组件. 您可能感兴趣的相关文章 10大流行 Metro UI 风格的 Bootstrap 主题和模板 Verlet-js:超炫的开源 JavaScript 物理引擎推荐 基于 Twitter Bootstrap 的精美扁平风格 UI…
Django中间件,CSRF(跨站请求伪造),缓存,信号,BootStrap(模板)-响应式(栅格)+模板 1.中间件(重要): 在Django的setting中有个MIDDLEWARE列表,里面的东西可以理解为过滤管道,里面有个安全过滤管道: from django.middleware.csrf import CsrfViewMiddleware里面有四个常用的方法: process_request:客户端请求的通道,但当此方法里面有return时就不会再执行后面的方法,直接走process…
1. 引言 An API for asynchronous programming with observable streams. ReactiveX is a combination of the best ideas from the Observer pattern, the Iterator pattern, and functional programming. ReactiveX 使用可观察数据流进行异步编程的API. ReactiveX结合了观察者模式.迭代器模式和函数式编程的精…
调用react-native-fs插件时,如果数据的接口是需要验证信息的,在android上运行报错,而在iOS上运行没问题.原因是因为接口是有验证信息的,而调用这个插件时没有传入,在iOS上会自动加上验证信息,而 android需要手动设置. 此错误的解决方法: 1.在调用登录接口时,保存下cookie(cookie在response里),在调用react-native-fs时放在headers里传入,代码如下: _appLogin(userName, password, callback){…
bootstrap导入 首先需要安装好插件 然后就是在代码器写导入代码 代码如下 <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> <meta name="viewport" content="width=device-width,initial-scale=1.0"&g…
你想建立一个后台管理面板或者分析仪表板吗?不需从头开始,Keen IO Bootstrap 是一个响应式的仪表盘模板,可以帮助你在几分钟内呈现数据,让你可以创建一个有吸引力的,定制的分析仪表板,随时可以展现给你的团队或您的客户. 在线演示      源码下载 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScript 特效 Web 开发中很实用的10个效果[源码下载] 12款经典的白…
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css"> <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <script src="http://cdn.bootcss.…
代码: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link href="../css/bootstrap.css" r…
在所有我看到过的基于Bootstrap的网站模版中,Metronic是我认为最优秀的,其外观之友好.功能之全面让人惊叹.Metronic 是一个自适应的HTML模版,提供后台管理模版和前端内容网页模版两种风格. Metronic 的特点 Metronic 有非常令人惊喜的功能和设计,可以满足你不同的需求.    其主要特点包括: HTML5 和 CSS3 自适应,基于响应式 Twitter Bootstrap 3.3 框架,同时面向桌面电脑.平板.手机等终端. 整合AngularJS 框架. 可…
关键词:viewport.栅格布局.媒体查询(Media Queries) 一.关于栅格布局的说明: 1.基本图解 extra small devices phones  超小型设备手机small devices tablets 小型设备平板电脑medium devices desktops 中型设备台式机large devices desktops 大型设备台式机 2.混用案例说明如:HTML代码:<div class="col-xs-12 col-sm-9 col-md-6 col-l…
一.介绍 响应式布局就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版本.这个概念是为解决移动互联网浏览而诞生的. 导航栏与轮播在大部分网站的头部占很高的比重,特别是导航栏,扮演着网站地图的角色. 在响应式布局中,要求导航栏能够根据终端屏幕大小显示不同的样式. 二.知识点 2.1 导航栏 官方解释:导航条是在您的应用或网站中作为导航页头的响应式基础组件.它们在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式. 2.1.1 基础导航栏 使用…
在Bootstrap中极其重要的一个技术内容便是响应式布局了,一次编码针对不同设备终端的强大能力使得响应式技术愈发流行. 不过正所谓"萝卜青菜各有所爱",如果你想要使用Bootstrap开发自己的项目却又恰巧不太喜欢响应式布局(或者你所设计的页面布局不允许你使用响应式技术),那么你可以通过以下方式禁用响应式布局. 移除标签 禁用第一步,就是需要移除在head标签中添加的 <meta name="viewport" content="width=dev…
1.要建立响应式网站的布局,这个时候bootstrap的高级就能体现出来了. 2.先来了解一下bootstrap提供了哪些响应式工具供我们使用: (1)屏幕宽度尺寸的概念: <768px                         xs  超小屏幕(手机) 768px>=   <992px        sm  小屏幕(平板) 992px>=    <1200px      md  中等屏幕(桌面) >=1200px                      lg…
1.Admin LTE 该模版开源免费.已用到项目中,客户评价说UI很好看... AdminLTE - 是一个完全响应式管理模板.基于Bootstrap3的框架.高度可定制的,易于使用.支持很多的屏幕分辨率适合从小型移动设备到大型台式机. 下载地址:https://www.almsaeedstudio.com/ demo: https://www.almsaeedstudio.com/themes/AdminLTE/index.html 2.Ace - Responsive Admin Temp…
1.Admin LTE 该模版开源免费. AdminLTE - 是一个完全响应式管理模板.基于Bootstrap3的框架.高度可定制的,易于使用.支持很多的屏幕分辨率适合从小型移动设备到大型台式机. 下载地址:https://www.almsaeedstudio.com/ 注:比较推荐使用这款模版,本人正在改造这款模版的首页供自己使用. 添加tabs标签,添加右键弹窗等. 2.Ace - Responsive Admin Template 该模版为收费模版. Ace 是一个轻量.功能丰富.HTM…
<meta name="viewport" content="width=device-width,user-scalable=no"/> <href="bs/css/bootstrap.min.css"/> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING…
(1)overflow: hiddenoverflow 属性规定当内容溢出元素框时发生的事情.这个属性定义溢出元素内容区的内容会如何处理.hidden 表示内容会被修剪,并且剪掉的内容是不可见的. (2)white-space: nowrap规定文本不进行换行.white-space 属性设置如何处理元素内的空白.nowrap 表示文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止. (3)text-overflow: ellipsistext-overflow 属性规定当文本…
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>Title</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> bod…
这是一个响应式设计的菜单.单击列表图标,当你显示屏大小可以完全水平放下所有菜单项时,菜单水平显示(如图1).当你的显示屏不能水平放置所有菜单项时,菜单垂直显示(如图2). 而且显示的时候是以动画的型式显示.效果相当的好. 点击这里在线预览 下面贴出实现这功能的源代码,这是一个纯用css3实现的菜单 html代码: <div class="container"> <!--[if lte IE 8]> <style> .iconicmenu > l…
1.bootstrap提供了js插件——轮播图 我们还是照旧,直接拿过来用,需要改的地方再说. 2.修改 小屏幕看小图,大屏图看大图:这个可以利用自定义属性(data-XXX)data-img-lg(保存大图)和data-img-xs(保存小图)属性保存图片的路径,利用jQuery的data函数取出data-xxxx属性进行动态加载. 图片居中显示:大图用背景图片来做比较好一点,小图用img来做比较好一点(因为小图的话需要等比例缩放,用背景图做不到等比例缩放). 承载轮播图的盒子高度:大图的的时…
1.bootstrap给我们提供了标签页 细细看了一下bootstrap的标签页源码,对tab选项卡有了更深的理解.其实说来也简单,以前自己写js和css时没有意识到整体的划分.就是分为两部分:一部分是标签页头部,一部分就是标签页展示内容区域. 2.使用bootstrap的自带样式 3.自带样式还是有点难看,需要自己修改一下…
1.手动配置viewport 在HTML中: <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"> 以上代码的作用是:让viewport的宽度等于当前设备的宽度,同时不允许用户手动缩放,其中initial-scale=1.0和maximum-scale=1.0不是必须要添加的,需要根据用户需求,其中wi…
http://www.cnblogs.com/lhb25/p/metronic-responsive-admin-dashboard-template.html…
1.navbar-导航条 1.navbar-fixed-top,让导航条固定显示在页面上部(注意:固定的导航条会遮住代码,解决方案,给body设置padding-top的值[大于或等于]为我们导航条的实际高度,如我们nav的height为50px,我们设置body {padding-top:50px;},这样就可以避免导航条遮住我们的内容部分) 2.包含一个.container 或 container-fluid容器,导航条居中或者自适应显示 3.导航条默认.navbar-default是白底显…
当宽度小于768px,由于表格的内容不能填充到出现横向滚动条 单元格内容不够: 出现横向滚动条…
Bootstrap,是基于HTML,CSS.javascript的前端框架 该框架已经预定义了一套CSS样式和与样式相对应的js代码(对应的样式有对应的特效.) 开发人员只需要编写HTML结构,添加bootstrap固定的class样式,就可以轻松完成指定效果的实现. 作用: 1.Bootstrap使得Web开发更加快捷,高效 2.Bootstrap支持响应式开发,解决了移动互联网前端开发问题. 简单介绍一下: 该框架是Twitter公司的设计师Mark Otto和jacob Thornton…
Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发.这些可以通过媒体查询结合大型.小型和中型设备,实现内容对设备的显示和隐藏. 需要谨慎使用这些工具,避免在同一个站点创建完全不同的版本.响应式实用工具目前只适用于块和表切换.   超小屏幕手机 (<768px) 小屏幕平板 (≥768px) 中等屏幕桌面 (≥992px) 大屏幕桌面 (≥1200px) .visible-xs-* 可见 隐藏 隐藏 隐藏 .visible-sm-* 隐藏 可见 隐藏 隐藏 .visible-…
本文转自:http://www.shejidaren.com/responsive-tables-for-bootstrap-3.html 这个Responsive tables jQuery插件依赖于Bootstrap 3使用,比BS自带的自适应多了一些好用的功能,比如筛选显示,Focus选定.Table头滑动固定等,下来看看介绍. &amp;lt;img alt="响应式表格jQuery插件 - Responsive tables" src="http://ima…