手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >巧用CSS来控制div自适应浏览器的高度
巧用CSS来控制div自适应浏览器的高度
摘要:有些朋友在用css+div做站的时候,经常会碰到这样一个问题,某个框架在不同的浏览器下会变形或者位置错乱,这该怎么办呢?其实方法很简单,用以...

有些朋友在用css+div做站的时候,经常会碰到这样一个问题,某个框架在不同的浏览器下会变形或者位置错乱,这该怎么办呢?其实方法很简单,用以下代码就可以解决了:

<html>
 <head>
 <style>
 #myTable{height:100%;border:solid 1px red;width:100%;}
 #top{margin-top:1px;height:100px;border:solid 1px green}
 #down{margin-top:1px;height:89%;border:solid 1px silver}
 #left{height:100%;border:solid 1px black;margin:1px;width:200px;float:left;}
 #right{border:solid 1px #0aa;margin:1px;height:100%;width:240px;overflow:scroll;
 }
 </style>
 </head>
 <body>
 <table id='myTable'>
 <tr><td>
 <div id='top'></div>
 <div id='down'>
 <div id='left'></div>
 <div id='right'>
 这里是内容
 这里是内容容这里是内容
 这里是内容
 这里是内容
 这里是内容
 这里是内容
 这里是内容这里是内容
 这里这里是内容
 
 这里是内容
 这里是内容
 这里是内容
 
 这里是内容
 这里是内容
 这里是内容
 这里是双线空间是内容
 这里这里是内容
 
 这里是内容
 这里是内容
 这里是内容
 
 这里是内容
 这里是内容这里是内容
 
 这里是内容
 
 这里是内容
 这里是内容这里是内容
 这里这里是内容
 
 这里是内容
 这里是内容
 这里是内容
 这里是内容
 这里是内容容这里是内容
 这里是内容
 这里是内容这里是内容
 这里这里是内容
 
 这里是内容
 这里是内容
 这里是内容
 这里是内容
 这里是内容容这里是内容
 </div>
 </div>
 </td>
 </tr></table>
 </body>
 </html>

【巧用CSS来控制div自适应浏览器的高度】相关文章:

CSS代码如何使图片自适应显示宽度

CSS屏蔽Webkit浏览器input高亮和textarea缩放

关于浏览器兼容性的讨论

CSS控制让每行显示4个图片的样式

用CSS巧控制段落缩进的方法

CSS兼容IE6、IE7、IE8和Firefox浏览器的方法

子元素div高度不确定时父div高度如何自适应

用CSS控制网页总体风格

css在不同浏览器中的唯一标识以height属性为例

DIV+CSS:网页一行两列背景自适应

精品推荐
分类导航