CSS div 高度满屏
方法一:
通过JQuery,获取窗体的高度,设置给对应的div.代码如下
ht = $(document.body).height();
$("#mDiv").height(ht - );
缺点:由于浏览器是先解析css,后执行JS,导致页面在加载时,mDiv先呈现其原始高度,再变为其全屏效果,div在页面中有一个闪烁
方法二:
通过css的calc()函数实现,其中,vh(1vh
being one percent of the view-port's height)
#mDiv {
width: 100%;
min-height: 300px;
/*height:100%;*/
height:calc(100vh - 170px);
}
参考网址:Here
CSS div 高度满屏的更多相关文章
- div 自动满屏
通常通过jq来做,类似这样: $('#navigation').css({ height: $(window).innerHeight() }); css3后,只需要用 下面这段样式即可 #navig ...
- css 让内容满屏居中不变形
.selector { position: fixed; width: 100%; height: 100%; background-image: url(path); background-repe ...
- css广告弹窗满屏跑
window.onload=function(){ //广告滚动 var oneInner = $('#divid')[0]; //定时器 var a1a = setInterval(moves,10 ...
- CSS(十三).高度如何铺满全屏
该需求来源一次面试题. IE6不认识!important声明,IE7.IE8.Firefox.Chrome等浏览器认识:而在怪异模式中,IE6/7/8都不认识!important声明,这只是区别的一种 ...
- css背景图片拉伸 以及100% 满屏显示
如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...
- CSS+DIV两栏式全屏布局
在网上找了很久,发现大部分都是固定宽度设置两栏,全屏情况下的布局很少.最后终于完成了,写出来备查,也供大家参考. <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- CSS布局:div高度随窗口变化而变化(BUG会有滚动条)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS未知div高度垂直居中代码_层和布局特效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 纯CSS实现Div高度根据自适应宽度(百分百调整)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- tmux终端工具的简单使用
Linux上管理和运行进程除了程序级别的守护进程之外,经常用到的有比如nohup &的方式,以及screen会话的方式,而Tmux正是一个非常优秀的终端进程管理的软件,和GNU screen类 ...
- MUI框架开发HTML5手机APP(二)--页面跳转传值&底部选项卡切换
概 述 JRedu 在上一篇博客中,我们学习了如何使用Hbuilder创建一个APP,同时如何使用MUI搭建属于自己的第一款APP,没有学习的同学可以戳链接学习: http://www.cnblo ...
- Activity class {com.../com....MainActivity} does not exist.
报错信息如上图所示,解决步骤: 1. 首先是检查这个MainActivity.java是不是真的存在,且包名和路径无误: 2. 如果文件存在,且包名和路径没有问题,那么就打开你项目所在的/androi ...
- 机器人中的轨迹规划(Trajectory Planning )
Figure. Several possible path shapes for a single joint 五次多项式曲线(quintic polynomial) $$\theta(t)=a_0+ ...
- 关于snowflake算法生成的ID转换为JS的数字类型由于过大导致JS精度丢失的问题
JS的数字类型目前支持的最大值为:9007199254740992,一旦数字超过这个值,JS将会丢失精度,导致前后端的值出现不一致. JAVA的Long类型的 最大值为:922337203 ...
- celery --分布式任务队列
一.介绍 celery是一个基于python开发的分布式异步消息任务队列,用于处理大量消息,同时为操作提供维护此类系统所需的工具. 它是一个任务队列,专注于实时处理,同时还支持任务调度.如果你的业务场 ...
- Python之string
1.string模块支持哪些字符形式?分别是什么. string支持的字符形式有: ('_re', '====>', <module 're' from 'C:\Python25\lib\ ...
- vultr搭建ss
我在Ubuntu1604上运行的sslocal,但是发现firefox无法链接ss代理,后来用的chromium才成功连接上, ---------------------------- 下面是正文 - ...
- C语言 · 8皇后问题
题目:8皇后问题 在8×8的棋盘上,放置8个皇后(棋子),使两两之间互不攻击.所谓互不攻击是说任何两个皇后都要满足: (1)不在棋盘的同一行: (2)不在棋盘的同一列: (3)不在棋盘的同一对角线上. ...
- js命名空间的函数namespace
这是一个扩展函数,需要初期加载的时候加载到适当的位置. 具体函数体如下: $.namespace = function() { var a=arguments, o=null, i, j, d; fo ...