0

我需要三个 div 来根据它们的显示属性动态分割容器的空间。如果所有三个都显示，那么用户应该看到三个等分的 div（1/3、1/3、1/3）。如果只显示两个，那么用户应该看到 1/2 和 1/2。如果只有一个可见，那么它应该填满所有容器空间。

4

1 回答 1

4

你可以使用jquery

<html>
<head>
    <title>equal div</title>
    <script type="text/javascript" src="jquery.js"></script>
    <style type="text/css">
        body{margin: 0; padding: 0;}
        #container{width: 100%, height: 100%;background: #666;}
        #container div{ float: left; border: 1px solid #000; margin: -1px; background: red}
    </style>
    <script type="text/javascript">
    $().ready(function(){
        var c = $('#container').children('div').length;
        $('#container').children().css('width', 100/c+'%');
    });
    </script>
</head>
<body>
    <div id="container">
        <div>1</div>
        <div>2</div>
        <div>3</div>
    </div>
</body>

希望能帮助到你。

于 2012-10-28T00:31:05.637 回答