如何设置自适应当前浏览器高度的div块
嗯 就是下面这样
<!DOCTYPE html>
<head>
<title>adaptive this page size</title>
<script type="text/javascript">
function adpaHeight()
{
var bodyHeight = document.documentElement.clientHeight; //获取当前浏览器宽高
document.getElementById("t1").style.height = (parseInt(bodyHeight)) + 'px'; //设置当前div宽高
}
window.onload = function(){
adpaHeight();
}
window.onresize = function(){
adpaHeight();
}
</script>
<style>
#t1{
background-color:#ee22cc;
}
#t2{
background-color:#ccee11;
height:100px; }
</style>
<body>
<div id="t1">自适应当前浏览器高度</div>
<div id="t2"></div>
</body>
</html>
这个应该没什么兼容问题哒;
如何设置自适应当前浏览器高度的div块的更多相关文章
- 实现不同分辨率、不同浏览器下高度自适应、iframe高度自适应
html: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...
- WPF设置DataGrid行内容高度自适应 与 TextBox/TextBlock内容高度自适应
WPF设置DataGrid行内容高度自适应 TextBox/TextBlock内容高度自适应 参考: DataGrid 控件中的调整大小选项: http://msdn.microsoft.com/ ...
- 设置DIV块元素在浏览器页面中垂直居中
任务目标 实践HTML/CSS布局方式 深入了解position等CSS属性 任务描述 实现如 示例图(点击打开) 的效果 灰色元素水平垂直居中,有两个四分之一圆位于其左上角和右下角. 任务注意事项 ...
- 两段超简单jquery代码解决iframe自适应高度问题(不用判断浏览器高度)
这里介绍两个超级简单的方法,不用写什么判断浏览器高度.宽度啥的.下面的两种方法自选其一就行了.一个是放在和iframe同页面的,一个是放在test.html页面的.注意别放错了地方.iframe的代码 ...
- 如何设置body高度为浏览器高度
html{height:100%} body{min-height:100%} 有时我们的页面上内容不多,但设计师要求背景色必须铺满全屏,这时候只需在样式表中加上这行,body就以浏览器的高度显示,超 ...
- iframe的内容增高或缩减时设置其iframe的高度的处理方案
WEB管理软件往往是如下结构的 用户点击子页tab切换中部的显示内容,在切换过程中需要保证前面的子页保持先前的状态.这种情况一般都使用iframe来来作为切换的子页显示内容. 但是这里有一个问题,if ...
- 设置一个DIV块固定在屏幕中央(两种方法)
设置一个DIV块固定在屏幕中央(两种方法) 方法一: 对一个div进行以下设置即可实现居中. <style> #a{ position: fixed; top: 0px; left: 0p ...
- ios webview自适应实际内容高度4种方法
有的时候会碰见类似的苦逼需求, webview自适应实际内容高度 下面有四种方法供使用 方法1:获取webview中scrovllview的contentsize进行设置 1 2 3 4 5 6 ...
- DIV布局-高度不同DIV,自动换行并对齐
最近弄了一个动态添加div框,每个div框内容有多有少,要支持div高度自适应,还要添加的div自动追加,并且换行还要保持每行对齐. 刚开始的效果: 要改啊,搞不定,问了UI高手,终于给出了完美解决方 ...
随机推荐
- MySQL表-----查询------
``模糊查询4.2.1[使用like进行模糊查询]注意:like运算副只用于字符串,所以仅与char和varchar数据类型联合使用例:select * from a where name like ...
- MySQL二进制日志总结
二进制日志简单介绍 MySQL的二进制日志(binary log)是一个二进制文件,主要用于记录修改数据或有可能引起数据变更的MySQL语句.二进制日志(binary log)中记录了对MySQL数据 ...
- Jmeter-线程组
1.Sampler 取样器(Sampler)是性能测试中向服务器发送请求,记录响应信息,记录响应时间的最小单元,JMeter 原生支持多种不同的sampler , 如 HTTP Request Sam ...
- 在腾讯云上把Laravel整合万向优图图片管理能力,打造高效图片处理服务
推荐理由: 现如今数据爆炸性增长,人类生活产出的数据越来越多,文字信息,图片信息,视频信息:但有很多信息我们都无法直接使用,需通过一定的处理,才能够获取其中对我们有用的信息,在腾讯云上的万向优图能够对 ...
- 记录一次raid数据恢复及回迁成功的案例
故障发生在两块盘组成的一个raid0上,其中的一块盘亮黄灯,被raid卡踢出后,raid崩溃,下面就把当时抢救数据的整个过程进行介绍. 由于硬盘是两块SAS 300G的硬盘,先把硬盘从机器中拔出来,然 ...
- 老李推荐:第2章4节《MonkeyRunner源码剖析》了解你的测试对象: NotePad窗口Activity之菜单简介
老李推荐:第2章4节<MonkeyRunner源码剖析>了解你的测试对象: NotePad窗口Activity之菜单简介 NotePad窗口Activity之菜单简介 这里我们总共用到 ...
- (转)Java并发编程:并发容器之ConcurrentHashMap
下面这部分内容转载自: http://www.haogongju.net/art/2350374 JDK5中添加了新的concurrent包,相对同步容器而言,并发容器通过一些机制改进了并发性能.因为 ...
- matlab函数:residue和residuez的用法
一.residue函数 1. 概念:在部分分式展开式和多项式系数之间转换.(Convert between partial fraction expansion and polynomialcoeff ...
- Eclipse中Maven插件部分常用功能命令介绍
原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/6689010.html Eclipse中安装Maven插件之后,就能很方便的管理Maven项 ...
- Use “error_messages” in Rails 3.2? (raises “undefined method” error)
I am getting the following error in my Rails 3.2 functional tests: ActionView::Template::Error: unde ...