这样的页面布局怎么实现：上下两个DIV，上面哪个固定大小，比如高度68PX,下面哪个DIV要求把剩下的高度全部填充。

zengjd 2009-02-09 09:20:27

...全文

648 16 打赏收藏转发到动态举报

写回复

用AI写文章

16 条回复

切换为时间正序

请发表友善的回复…

发表回复

dragonmay2008 2009-02-09

打赏
举报

那确实

flying_net 2009-02-09

打赏
举报

那就只能用Js控制了，Css没有办法了

zengjd 2009-02-09

打赏
举报

[Quote=引用 10 楼 flying_net 的回复:]
<div style="height:100px;border:1px #f00 solid;">asd </div>

<div style="height:expression(document.body.clientHeight-100);border:1px

#000 solid;">aaa </div>

注意，仅限于IE
[/Quote]

仅限于IE不行啊！

flying_net 2009-02-09

打赏
举报

<div style="height:100px;border:1px #f00 solid;">asd</div>

<div style="height:expression(document.body.clientHeight-100);border:1px

#000 solid;">aaa</div>

注意，仅限于IE

zengjd 2009-02-09

打赏
举报

[Quote=引用 8 楼 xiaojing5202 的回复:]
假设高度为800px的话

<div style="height:68px"> </div>
<div style="height:732"> </div>
[/Quote]

服了，你这种回答麻烦拿到水坛里面好不好？

静舞 2009-02-09

打赏
举报

假设高度为800px的话

<div style="height:68px"> </div>
<div style="height:732"> </div>

flying_net 2009-02-09

打赏
举报

[Quote=引用 6 楼 zengjd 的回复:]
引用 5 楼 booksky508 的回复:
总高度设为100%，上面的div高度68，下面的div不设高度。

HTML code
<div style="WIDTH: 100%; HEIGHT: 100%">
<div style="WIDTH: 100%; HEIGHT: 80px">
<label style="WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #ff0066"></label>
</div>
<div>
<iframe src =madataeditMain.aspx style="WIDTH…
[/Quote]

你在下面的div中放了个iframe ,那下面的div再放其他东西要往哪里放.....

booksky508，你还是需要去调试一下看看你说的那个是不是可行

zengjd 2009-02-09

打赏
举报

[Quote=引用 5 楼 booksky508 的回复:]
总高度设为100%，上面的div高度68，下面的div不设高度。
[/Quote]



		<div style="WIDTH: 100%; HEIGHT: 100%">

			<div style="WIDTH: 100%; HEIGHT: 80px">

				<label style="WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #ff0066"></label>

			</div>

			<div>

				<iframe src =madataeditMain.aspx  style="WIDTH: 100%; HEIGHT: 100%"></iframe>					

			</div>		

		</div>

这样不行啊

booksky508 2009-02-09

打赏
举报

总高度设为100%，上面的div高度68，下面的div不设高度。

zengjd 2009-02-09

打赏
举报

[Quote=引用 3 楼 Heaven_feather 的回复:]
<div style="height:68px"> </div>
<div style="height:70%"> </div>

你试下..调一下应该就行了
[/Quote]

呵呵，专业点儿行不？即使调试好了，高度一改变，效果就不一样了。
这是数学问题。

Heaven_feather 2009-02-09

打赏
举报

<div style="height:68px"></div>
<div style="height:70%"></div>

你试下..调一下应该就行了

qianyin123 2009-02-09

打赏
举报

你设高 100% 不行吗。。

flying_net 2009-02-09

打赏
举报

Css没有办法，只能用js控制

y63964632 2009-02-09

打赏
举报

关注下
我也找这个问题的答案~

booksky508 2009-02-09

打赏
举报

上面的有点问题，改成下面这样：



<head runat="server">

    <title>Untitled Page</title>

    <style>

        body, html

        {

            margin: 1;

            width: 100%;

            height: 100%;

        }

        div

        {

            border: 1px solid red;

        }

    </style>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <div style="width: 100%; height: 80px">

            <label style="width: 100%; height: 100%; background-color: #ff0066">

            </label>

        </div>

        <div>

            <iframe src="madataeditMain.aspx" style="width: 100%; height: 100%"></iframe>

        </div>

    </div>

    </form>

</body>

</html>

把style中的div删了

booksky508 2009-02-09

打赏
举报

[Quote=引用楼主 zengjd 的帖子:]
这样的页面布局怎么实现：上下两个DIV，上面哪个固定大小，比如高度68PX,下面哪个DIV要求把剩下的高度全部填充。
[/Quote]



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplicationDiv._Default" %>



<!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 runat="server">

    <title>Untitled Page</title>

    <style>

        div,body,html 

        {

            margin: 1;

            width: 100%;

            height: 100%;

        }

        div

        {

            border: 1px solid red;

        }

    </style>

</head>

<body>

    <form id="form1" runat="server">

    <div style="WIDTH: 100%; HEIGHT: 100%">

          <div style="WIDTH: 100%; HEIGHT: 80px">

                <label style="WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #ff0066"></label>

            </div>

            <div>

                <iframe src =madataeditMain.aspx  style="WIDTH: 100%; HEIGHT: 100%"></iframe>                    

            </div>         

        </div>



    </form>

</body>

</html>