如何将div分成3x3等效div?

时间:2016-04-24 19:16:47

标签: css web

现在我有一个任务需要解决。我希望你能分享任何方式将1 div除以3x3 DIVS只有百分之和没有bootstrap和flex模型。感谢

1 个答案:

答案 0 :(得分:1)

适用于所有浏览器:

*{box-sizing:border-box; -webkit-box-sizing:border-box;}
html, body{height:100%; margin:0;}

.table{
  display:table;
  table-layout:fixed;
  border-collapse: collapse;
  background:#eee;
  width:100%;
  height:100%;
}
.row{ display: table-row; }
.cell{ display: table-cell; }
<div class="table">
  <div class="row">
    <div class="cell">1</div>
    <div class="cell">2</div>
    <div class="cell">3</div>
  </div>
  <div class="row">
    <div class="cell">4</div>
    <div class="cell">5</div>
    <div class="cell">6</div>
  </div>
  <div class="row">
    <div class="cell">7</div>
    <div class="cell">8</div>
    <div class="cell">9</div>
  </div>
</div>