【问题标题】:Bootstrap - create 100 columns grid that marry the shape of a circleBootstrap - 创建与圆形相结合的 100 列网格
【发布时间】:2017-05-29 22:57:52
【问题描述】:

我有一个圆形的容器。我想创建一个包含 100 列的网格。我想要一个函数来创建一个形状与圆形相结合的网格。

到目前为止,我已经创建了一个方形网格 (10x10)

for (var i=0; i<10; i++) {
  var $row = $('<div class="row"></div>');
  for (var j=0; j<10; j++) {
    $row.append('<div class="col-xs-1 ' + (j==0 ? "col-xs-offset-1" : "") + ' grid_cell"><span class="glyphicon glyphicon-user"></span></div>');
    }
  $("#grid_1").append($row);
};

见小提琴:https://jsfiddle.net/vo1npqdx/884/

是否有一个数学定理可以帮助解决这个问题?

------------------------------------------ - - - - - - - - - -编辑 - - - - - - - - - - - - - - - --------------------------------

我设法做这样的事情手动放置单元格(使用开关盒)。有什么办法可以改善吗?

https://jsfiddle.net/vo1npqdx/886/

【问题讨论】:

    标签: javascript css twitter-bootstrap twitter-bootstrap-3 grid-layout


    【解决方案1】:

    我尝试使用display:flex 属性。我没有创建 10x10。我的方法是完全动态的。请检查这个小提琴。 https://jsfiddle.net/nc3uLy6L/

    【讨论】:

    • 有趣,但是所有图标必须完全可见
    猜你喜欢
    • 1970-01-01
    • 2015-06-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-04-29
    相关资源
    最近更新 更多