css 控制div高度自适应浏览器的高度

标签: css 控制 div | 发表时间:2012-09-26 10:11 | 作者:小桥屋檐下
出处:http://www.cnblogs.com/

css 控制div高度自适应浏览器的高度

1 <html>
2 <head>
3 <style>
4 #myTable{height:100%;border:solid 1px red;width:100%;}
5 #top{margin-top:1px;height:100px;border:solid 1px green}
6 #down{margin-top:1px;height:89%;border:solid 1px silver}
7 #left{height:100%;border:solid 1px black;margin:1px;width:200px;float:left;}
8 #right{border:solid 1px #0aa;margin:1px;height:100%;width:240px;overflow:scroll;
9 }
10 </style>
11 </head>
12 <body>
13 <table id='myTable'>
14 <tr><td>
15 <div id='top'></div>
16 <div id='down'>
17 <div id='left'></div>
18 <div id='right'>
19 这里是内容
20 这里是内容容这里是内容
21 这里是内容
22 这里是内容
23 这里是内容
24 这里是内容
25 这里是内容这里是内容
26 这里这里是内容
27
28 这里是内容
29 这里是内容
30 这里是内容
31
32 这里是内容
33 这里是内容
34 这里是内容
35 这里是内容这里是内容
36 这里这里是内容
37
38 这里是内容
39 这里是内容
40 这里是内容
41
42 这里是内容
43 这里是内容这里是内容
44
45 这里是内容
46
47 这里是内容
48 这里是内容这里是内容
49 这里这里是内容
50
51 这里是内容
52 这里是内容
53 这里是内容
54 这里是内容
55 这里是内容容这里是内容
56 这里是内容
57 这里是内容这里是内容
58 这里这里是内容
59
60 这里是内容
61 这里是内容
62 这里是内容
63 这里是内容
64 这里是内容容这里是内容
65 </div>
66 </div>
67 </td>
68 </tr></table>
69 </body>
70 </html>

 

本文链接

相关 [css 控制 div] 推荐:

css 控制div高度自适应浏览器的高度

- - 博客园_首页
css 控制div高度自适应浏览器的高度. 20 这里是内容容这里是内容. 25 这里是内容这里是内容. 35 这里是内容这里是内容. 43 这里是内容这里是内容. 48 这里是内容这里是内容. 55 这里是内容容这里是内容. 57 这里是内容这里是内容. 64 这里是内容容这里是内容.

幾個div+css 面試題,轉來大家一起來看看!

- - wowbox blog (網頁設計知識庫)
1、超鏈接訪問過後hover樣式就不出現的問題. 被點擊訪問過的超鏈接樣式不在具有hover和active了,解決方法是改變CSS屬性的排列順序: L-V-H-A. 2、IE6的雙倍邊距BUG. 浮動後本來外邊距10px,但IE解釋為20px,解決辦法是加上display:inline. 3、為什麼FF下文本無法撐開容器的高度.

DIV+CSS解决IE6,IE7,IE8,FF兼容问题

- - Web前端 - ITeye博客
1.ie8下兼容问题,这个最好处理,转化成ie7兼容就可以. 在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了. 2.flaot浮动造成IE6下面双倍边距问题,这个最常见,也最好处理,!important解决,比如. margin-left:10px !important;/*IE7,IE8,FF下是10PX*/;.

DIV CSS 网页兼容全搞定 (IE6 IE7 IE8 IE9 火狐 谷歌)

- - CSDN博客研发管理推荐文章
本文收集整理了IE7,6与Fireofx的CSS兼容性处理技巧,供大家参考.   请尽量用xhtml格式写代码,而且DOCTYPE影响 CSS 处理,作为W3C标准,一定要加DOCTYPE声明.    1.div的垂直居中问题.   vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.

Java与Flex学习笔记----用CSS控制页面样式

- - BlogJava-首页技术区
以前对于Flex网页布局还不是很明白,基本上没有什么修饰. 但是做完了一个仿“115网盘”的页面后,对页面控制有了一个基本的了解,现总结一下.      本人一开始接触的就是Flex4,据说Flex3的css布局很脊椎,也不知道是不是这样. 但是Flex4的网页布局很牛X,再配上各种事件,可以实现需要写很多JavaScript/Ajax代码才能实现的效果.

div 添加滚动条

- - CSDN博客推荐文章
style="overflow: hidden; width: 100px; white-space: nowrap; text-overflow: ellipsis" //让所有的table td都展开. overflow-y: hidden; overflow-x: scroll; width: 987px  //设置竖着没有滚动条,横着有滚动条 ,一定要设置宽度.

div在页面中的高

- - Web前端 - ITeye博客
这里是javascript中制作滚动代码的常用属性. 页可见区域宽: document.body.clientWidth;. 网页可见区域高: document.body.clientHeight;. 网页可见区域宽: document.body.offsetWidth   (包括边线的宽);. 网页可见区域高: document.body.offsetHeight (包括边线的宽);.

jQuery拖拽div实现

- - CSDN博客Web前端推荐文章
思路是利用jquery的mousemove,mousedown,mouseup三个事件,定义两个相对位置,分别是. 1、组件左上角与屏幕左上角的相对位置. 2、鼠标所在坐标与组件左上角的相对位置. $(document).ready(function(){ var move=false;//移动标记 var _x,_y;//鼠标离控件左上角的相对位置.

HTML标签p和div的不同

- - CSDN博客Web前端推荐文章
标题:HTML标签p和div的不同. 原文:What is the difference between

and

?. 链接: http://stackoverflow.com/questions/2226562/what-is-the-difference-between-p-and-div.

CSS图形

- GLORY - 酷壳 - CoolShell.cn
下面的示例展示了使用纯CSS制作的各种图形,你可以自由地修改文中的CSS代码. 经测试,IE9, Chrome, FF, Safari都可以正常显示. 五角星形 via Kit MacAllister. 心形 via Nicolas Gallagher. 无穷大 via Nicolas Gallagher.