Bootstrap使用后笔记
Bootstrap Modal 垂直居中 在 bootstrap.js中修改如下代码:
Modal.prototype.adjustDialog = function () {
var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight
this.$element.css({
paddingLeft: !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : '',
paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : ''
})
// 是弹出框居中。。。
var $modal_dialog = $(this.$element[0]).find('.modal-dialog');
var m_top = ( $(window).height() - $modal_dialog.height() )/2;
$modal_dialog.css({'margin': m_top + 'px auto'});
}
Bootstrap Model点击空白处 popup会关闭:
增加属性
data-backdrop="static"
Bootstrap使用后笔记的更多相关文章
- 《深入理解bootstrap》读书笔记:第4章 CSS组件(下)
十. 标签(.label类,label-xxx) 高亮一些标题部分. 1 2 3 4 5 6 <h1>HELLO<span class="label label-defau ...
- 《深入理解bootstrap》读书笔记:第4章 CSS组件(上)
bootstrap三大核心之二. 包括glyphicon图标,下拉菜单(dropdown),按钮组(button group)....等等. 一. 图标字体 bootstrap3提供了200多个免费图 ...
- 《深入理解bootstrap》读书笔记:第三章 CSS布局
一. 概述一下理念 bootstrap基于H5开发.提倡移动先行(媒询声明是必须的),对浏览器支持面不是很广. 响应式图片:max-width:100% height:auto; 可以加上:.img- ...
- Bootstrap+JSP实例学习笔记一.简单的带登录功能的首页
前言 Bootstrap 是流行的 HTML.CSS 和 JS 框架,用于开发响应式布局.移动设备优先的 WEB 项目.源自于twiteer内部的开发框架. 当前(2019-05)最新版本是v3.3. ...
- 《深入理解bootstrap》读书笔记:第二章 整体架构
一. 整体架构 1. CSS-12栅格系统 把网页宽度均分为12等分(保留15位精度)--这是bootstrap的核心功能. 2.基础布局组件 包括排版.按钮.表格.布局.表单等等. 3.jQu ...
- 《深入理解bootstrap》读书笔记:第一章 入门准备
一.bootstrap框架简介 Bootstrap是最流行的前端开发框架. 什么是框架:开发过程的半成品. bootstrap具有以下重要特性: (1)完整的CSS样式插件 (2)丰富的预定义样式表 ...
- css去掉使用bootstrap框架后打印网页时预览效果下的超链接
在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...
- Bootstrap 基础学习笔记(一)
排版 (1)标题 Bootstrap标题样式进行了以下显著的优化重置: 1.重新设置了margin-top和margin-bottom的值, h1~h3重置后的值都是20px:h4~h6重置后的值都 ...
- 《深入理解Bootstrap》读书笔记(一)
栅格系统 实现原理 通过定义容器大小,平分12份,再调整内外边距,最后结合媒体查询. 通过一系列包含内容的行和列来创建页面布局.下面列出了 Bootstrap 栅格系统是如何工作的: 1.行必须放置在 ...
随机推荐
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(八)资源搜索模块
config.xml文件的配置如下: <widget label="资源搜索" icon="assets/images/public_impact_over.png ...
- 在Autodesk应用程序商店发布基于浏览器的Web应用程序
你一定已经听说过Autodesk应用程序商店了,通过Autodesk应用程序商店,你可以免费下载或购买来自全球的优秀开发者发布的应用程序,来帮助你更快更方便的完成你的工作.而且作为开发者,您也可以在A ...
- Docker dockerfile创建Eclipse镜像初试
抽空初步阅读了Docker技术入门与实战 [Kindle电子书] http://www.cnblogs.com/2018/p/4600116.html 现在想首先在开发环境下引入统一的环境,由于开发中 ...
- 职业规划:管理vs技术
"每个人都身怀天赋,但如果用会不会爬树能力来评判一只鱼,那它这辈子都会觉得自己是条蠢鱼" - 阿尔伯特.爱因斯坦 我想我为这篇博客已经准备了很长时间.但是看起了我还一直挣扎我该往哪 ...
- Failed to retrieve data for this request. (Microsoft.SqlServer.Management.Sdk.Sfc)
使用Microsoft SQL SERVER 2014 Management Studio访问Azure SQL Database时,查看存储过程时遇到下面错误信息: TITLE: Microsoft ...
- SQL Server 使用OPENROWSET访问ORACLE遇到的各种坑总结
在SQL Server中使用OPENROWSET访问ORACLE数据库时,你可能会遇到各种坑,下面一一梳理一下你会遇到的一些坑. 1:数据库没有开启"Ad Hoc Distributed Q ...
- flume:spooldir采集日志,kafka输出的配置问题
flume配置: #DBFile DBFile.sources = sources1 DBFile.sinks = sinks1 DBFile.channels = channels1 # DBFil ...
- MongoDB学习笔记~以匿名对象做为查询参数,方便查询子对象
回到目录 对于MongoDB的封装还在继续,对于不断追求简单的编程还在继续,对于喜欢代码的那么感觉,还在继续... 当你的mongo数据表里有子对象时,尤其是列表对象时,使用官方的驱动很是不爽,要记得 ...
- 【转】深入理解SQL的四种连接-左外连接、右外连接、内连接、全连接
[原文]:http://www.jb51.net/article/39432.htm 1.内联接(典型的联接运算,使用像 = 或 <> 之类的比较运算符).包括相等联接和自然联接. ...
- Linux – Usermod命令参数解析和实例说明
usermod 命令修改系统帐户文件来反映通过命令行指定的变化 1. 首先看看usermod都是有哪些参数 [root@hxweb101 ~]$ usermod --help Usage: userm ...