bootstrap弹出模态框会给body加padding的解决方法
bootstrap弹出模态框会给body加padding,导致页面缩放的解决方法:
在页面或是css文件里加上($paddingSize为less变量,需要改成像素或是其他单位,如12px,1rem):
body{
padding: $paddingSize !important;
}
这样在没有滚动条的情况下解决了。页面有滚动条的情况下页面还是会缩放。
原理是弹出时,bootstrap 给body上加了modal-open这个样式。
.modal-open的代码如下:
这样的好处是,弹缩后页面隐藏滚动条,让无法滚动。
如果重写:
bootstrap弹出模态框会给body加padding的解决方法的更多相关文章
- bootstrap弹出模态框
(1)引入jquery, bootstrap相关的 jquery下载地址: https://jquery.com/download/ bootstrap下载地址: https://v3.bootcss ...
- 从头开始一步一步实现EF6+Autofac+MVC5+Bootstarp极简前后台ajax表格展示及分页(二)前端修改、添加表格行点击弹出模态框
在前一篇中,由于不懂jquery,前端做的太差了,今天做稍做修改,增加一个跳转到指定页面功能,表格行点击样式变化.并且在表格中加入bootstarp的按钮组,按钮点击后弹出模态框,须修改common, ...
- Ajax发送请求等待时弹出模态框等待提示
主要的代码分为两块,一个是CSS定义模态框,另一个是在Ajax中弹出模态框. 查看菜鸟教程中的模态框教程demo,http://www.runoob.com/try/try.php?filename= ...
- JavaScript:用JS实现加载页面前弹出模态框
用JS实现加载页面前弹出模态框 主要的JavaScript 代码是: <script> //加载模态框 $('#myModal').modal(); $(document).ready(f ...
- bootstrap模态框动态赋值, ajax异步请求数据后给id为queryInfo的模态框赋值并弹出模态框(JS)
/查询单个 function query(id) { $.ajax({ url : "/small/productServlet", async : true, type : &q ...
- bootstrap-table:操作栏点击编辑按钮弹出模态框修改数据
核心代码: columns: [ { checkbox:true //第一列显示复选框 }, ... { field: 'fail_num', title: '失败数' }, { field: 'op ...
- jQuery点击弹出层,弹出模态框,点击模态框消失
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...
- yii 页面加载完成后弹出模态框
<?php $js = <<<JS $('#page-modal').modal('show');//页面加载完显示模态框 $('.modal-dialog').css('wi ...
- 关于系统弹出错误:429 , ActiveX 部件不能创建对象 的解决方法
例如:win7 win10的系统,有时候运行某些软件会出现:429 , ActiveX 部件不能创建对象 的情况. 提示: "运行时错误'429': ActiveX 部件不能创建对象&quo ...
随机推荐
- leecode第一百六十题(相交链表)
/** * Definition for singly-linked list. * struct ListNode { * int val; * ListNode *next; * ListNode ...
- [MySQL]配置多个MySQL服务(Windows)
配置多个MySQL服务 1.复制原解压好的MySQL文件到本目录下,且改名为MySQL2 2.修改MySQL2文件夹中的my.ini 修改my.ini文件中的以下内容,并保存文件: [client] ...
- C# 获取CPU序列号、网卡MAC地址、硬盘序列号封装类,用于软件绑定电脑
using System.Management; namespace GLaLa { /// <summary> /// hardware_mac 的摘要说明. /// </summ ...
- LeetCode--023--合并K个排序链表
合并 k 个排序链表,返回合并后的排序链表.请分析和描述算法的复杂度. 示例: 输入: [ 1->4->5, 1->3->4, 2->6 ] 输出: 1-&g ...
- java常用类介绍
1 日期时间.Math.枚举 1.1 日期时间 计算机如何表示时间? GMT时间指格林尼治所在地的标准时间,也称为时间协调时(UTC),其他地区的时间都是相对于GMT时间的偏移. 北京位于东八区 = ...
- 解决无法连接mysql问题
解决无法连接mysql问题 在my.ini文件下加入explicit_defaults_for_timestamp 清空data文件夹 Cmd初始化mysql 输入>Mysqld --in ...
- hdu6129 Just Do It!
多校时找规律做过... 题意,给你一个数列a[1], a[2], a[3], a[4], ... , a[n],操作一次后变为a[1], a[1] ^ a[2], a[1] ^ a[2] ^ a[3] ...
- The C compiler identification is unknown解决办法
环境:VS2015,CMake3.12.0. 问题一: 解决办法:下载并安装Windows SDK version 8.1. 问题二: 解决办法:这个问题百度了半天也没找到合适的办法,好多博客都是复制 ...
- .Net Core2.1 部署到IIS
1. 发布网站,和.net framework MVC一样 2.安装WindowsHosting和.Net Core SDK 下载地址:https://www.microsoft.com/net/do ...
- 主机连接虚拟机redis 服务器
1. centos 虚拟机安装redis sudo yum install epel-release sudo yum update sudo yum install redis sudo syste ...