-1

我在一个容器盒(和 10 个容器)中有一组 70 个方形 div 元素。我想在每个第 7 个 div 元素处设置一个断点,所以我最终得到 10 行,每行 7 个 div。正方形的边距应该很薄。我已将元素宽度设置为 13.68571428571429%,将其余部分保留为边距。

我怎样才能实现高度调整到宽度,所以我总是得到 7 个正方形,宽度和高度基于百分比相等?

尝试过 Javascript,但它渲染的时间太长,有 700 个方块。Flexbox 似乎只在较新的浏览器上兼容(我们仍然有相当数量的用户在较旧的浏览器上)。

这是我的html:

            <div class="wrapper">                   
                <div data-ng-repeat="square in [] | rangeFilter:1:70">
                    <div dir-square current-wrapper="{{wid}}" current-square="{{sid}}" class="square">
                        {{square}}
                    </div>
                    <div class="clearfix" ng-show="square % ctrl.Breakpoint == 0"></div>
                </div>      
            </div>
4

1 回答 1

0

如果您为容器设置了断点(宽度不会改变)。我建议您事先计算 px 并使用媒体查询进行设置。如果这是不可能的(您使用的是流体容器),那么您将需要使用 js。如果您发布您拥有的 javascript 代码,则可能有一些方法可以对其进行优化。

于 2015-05-01T18:55:20.870 回答