木子屋
 

标题: CSS display:table使用示例

作者: dnawo

日期: 2016-10-15 04:07 PM

分类: HTML/CSS

内容:
复制内容到剪贴板 程序代码<style type="text/css">
.table {display:table; text-align:center;}
.row {display:table-row;}
.cell {display:table-cell; vertical-align:middle; width:100px; height:100px; background-color:#063; border:1px solid #000;}
</style>
<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>

+ 查看当前日志评论 (0)

 

登录

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.047 ms

标题: CSS display:table使用示例

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.047 ms

暂无评论

返回

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.063 ms