DIV+CSS实现两边固定宽度,中间自适应宽度
作者:天魅 日期:2008-11-18
DIV适应一直都不如表格,不管理是高还是宽,当然也是能实现的,只是比较麻烦,下面来个例子,自己写的,有点占牛角尖...不多说看例子:
<因为是看到百度知道有人问我才做这个题目的,相信很多朋友也用得上,现在把百度知道的问题贴上来>
div+css做的网站,如何在不同分辨率下都全屏显示?请高手指点.
网站的结构是这样子的,顶部,中间,底部
然后中间部分又分3列,其中左右2列固定宽度,比如宽度都是200px,而中间我想要它自适应?
这样子如何定义CSS,让页面在不同分辨率下都全屏显示?
特别强调注意样式里的数字准确性,和HTML中调用时注意把是:左右中
FF和IE7测试没问题
HTML代码
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
<因为是看到百度知道有人问我才做这个题目的,相信很多朋友也用得上,现在把百度知道的问题贴上来>
div+css做的网站,如何在不同分辨率下都全屏显示?请高手指点.
网站的结构是这样子的,顶部,中间,底部
然后中间部分又分3列,其中左右2列固定宽度,比如宽度都是200px,而中间我想要它自适应?
这样子如何定义CSS,让页面在不同分辨率下都全屏显示?
特别强调注意样式里的数字准确性,和HTML中调用时注意把是:左右中
FF和IE7测试没问题
HTML代码[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
评论: 10 | 引用: 0 | 查看次数: 2724
- 1
谢谢博客主人~~哈哈哈哈哈哈哈哈~~~~ 

Of course,是后者...... 
感谢你对知识的分享..

感谢你对知识的分享..
划尽天际 ,我不知道你是个学生还是上班族,但是以为你学习能力和对知识正确性的追求,某天你会成为真正的高手!
不知道你的看法怎样?呵呵~~~
今天重新审视了一下代码,重新对margin理解了一下... 似乎昨天理解错了...
今天知道你的用意了..其实,在这里, 你只是固宽而已,某种意义上margin在这的功能和width有点相象...
但其实百度知道这个问题,我认为重点不在于margin的操作..
而是在于width的 auto属性的操作,这个固好了.. margin去掉,其实影响并不是很大.
今天知道你的用意了..其实,在这里, 你只是固宽而已,某种意义上margin在这的功能和width有点相象...
但其实百度知道这个问题,我认为重点不在于margin的操作..
而是在于width的 auto属性的操作,这个固好了.. margin去掉,其实影响并不是很大.

晕,回复不能运行,你把下面代码复制txt改html运行试试
划尽天际
其实你测一下就知道,那个Margin等于负数时的效果,当然在这里,在有的浏览器可能是多余的,中间是220,两边是200,中间有20差距,分别10给中间的左右间距,测试:
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.div{margin-left:-200px; width:200px; background-color:#FF0000; height:500px;}
</style>
</head>
<body>
<div class="div">我宽:200PX; margin左为-200px</div>
</body>
</html>
[html]
其实你测一下就知道,那个Margin等于负数时的效果,当然在这里,在有的浏览器可能是多余的,中间是220,两边是200,中间有20差距,分别10给中间的左右间距,测试:
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.div{margin-left:-200px; width:200px; background-color:#FF0000; height:500px;}
</style>
</head>
<body>
<div class="div">我宽:200PX; margin左为-200px</div>
</body>
</html>
[html]
对不起,您已回答过该问题。
如果您暂时看不到自己的回答,可能是因为正在进行审核。
如果您的回答没有违规,您将在几分钟之后看到自己的回答
....................................
第一次回答没通过不知道为什么,再回答就没办法回答了....没事,你可以把问题关了,能帮助你解决问题就好,分数也做不了什么,我1300多分不知道要做什么!
如果您暂时看不到自己的回答,可能是因为正在进行审核。
如果您的回答没有违规,您将在几分钟之后看到自己的回答
....................................
第一次回答没通过不知道为什么,再回答就没办法回答了....没事,你可以把问题关了,能帮助你解决问题就好,分数也做不了什么,我1300多分不知道要做什么!
您好,这个问题是我在百度提的,我收到了您在百度给我的消息,非常非常感谢您,
效果非常好,帮我解决了困惑我好久的难题.希望您把链接的地址发到这个问题里面,我想有这方面疑问的朋友一定也很需要,同时我再追加50分(好像只能追加2次,本想给您再多点的,呵呵!),表示感谢!
效果非常好,帮我解决了困惑我好久的难题.希望您把链接的地址发到这个问题里面,我想有这方面疑问的朋友一定也很需要,同时我再追加50分(好像只能追加2次,本想给您再多点的,呵呵!),表示感谢!
没明白为什么margin是负值..?
能否帮忙解释下?谢谢哦~
能否帮忙解释下?谢谢哦~
- 1
发表评论
上一篇
下一篇


Tags: 





