DIV做的Table

Posted Future.Net 博客

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了DIV做的Table相关的知识,希望对你有一定的参考价值。

<style>
        div.table{
    border:1px solid #d7d7d7;
    margin-left:0px;
    border-bottom-width:0;
    width:1200PX;
    border-left-width:0;
    text-align:left;
    line-height:40px;
}
.clear0{
    clear:both;
    height:0px;
}
div.table .row{
    clear:both;
    overflow:hidden;
    border-bottom:1px solid #d7d7d7;
}
.rowbak{
}
div.table .srow{/*没有cell的一行*/
    overflow:visible;
    margin-left:1px;
    border-bottom:1px solid #d7d7d7;
    border-left:1px solid #d7d7d7;
}
div.table .cell{
    border-left:1px solid #d7d7d7;
    float:left;
    margin-left:1px;
    margin-right:-1px;
    margin-bottom:-1000px;
    padding-bottom:1000px;
}
div.table .cellEnd{
    clear:both;
    width:0;
}
div.table .rowbak .cell{
    background-color:#f2ecec;
    height:100%;
}
    </style>
<div class="table" >  
      <div class="row" style="line-height:40px;background-color:#d7d7d7;text-align:center;">  
          <div class="cell "  style="width:50px;">&nbsp;&nbsp; </div>  
                    <div class="cell "  style="width:542px;">问题标题</div>  
                    <div class="cell w200"  style="width:100px;">用户名</div> 
                    <div class="cell" style="width:100px">提问时间</div>  
          <div class="cell" style="width:100px">状态</div>  
                    <div class="cell" style="width:100px;">厂牌</div>  
            <div class="cell" style="width:100px;">车型</div>  
            <div class="cell" style="width:100px;">年份</div>  
                    <div class="cellEnd"></div>  
                </div>  
                <div class="row rowbak">  
                    <div class="cell "  style="width:50px;">01</div>  
                    <div class="cell "  style="width:542px;">我的家庭协作我的家庭协作</div>  
                    <div class="cell "  style="width:100px;">234234234</div>  
                    <div class="cell" style="width:100px">2016/06/30</div> 
                    <div class="cell" style="width:100px">XXrld</div>  
                     <div class="cell" style="width:100px">XXXrld</div>  
                     <div class="cell" style="width:100px">XXXorld</div>  
                    <div class="cell" style="width:100px"> 操作34</div>  
                    <div class="cellEnd"></div>  
                </div>
    <div class="row rowbak">  
                    <div class="cell "  style="width:50px;">01</div>  
                    <div class="cell "  style="width:542px;">我的家庭协作我的家庭协作</div>  
                    <div class="cell "  style="width:100px;">234234234</div>  
                    <div class="cell" style="width:100px">2016/06/30</div> 
                    <div class="cell" style="width:100px">XXrld</div>  
                     <div class="cell" style="width:100px">XXXrld</div>  
                     <div class="cell" style="width:100px">XXXorld</div>  
                    <div class="cell" style="width:100px"> 操作34</div>  
                    <div class="cellEnd"></div>  
                </div>
    <div class="row rowbak">  
                    <div class="cell "  style="width:50px;">01</div>  
                    <div class="cell "  style="width:542px;">我的家庭协作我的家庭协作</div>  
                    <div class="cell "  style="width:100px;">234234234</div>  
                    <div class="cell" style="width:100px">2016/06/30</div> 
                    <div class="cell" style="width:100px">XXrld</div>  
                     <div class="cell" style="width:100px">XXXrld</div>  
                     <div class="cell" style="width:100px">XXXorld</div>  
                    <div class="cell" style="width:100px"> 操作34</div>  
                    <div class="cellEnd"></div>  
                </div>

  
</div>

 

以上是关于DIV做的Table的主要内容,如果未能解决你的问题,请参考以下文章

Discuz代码片段

关于react16.4

如何在html的表格中加入边框线

div 内table 居中实现代码

vscode中设置vue代码片段

怎么改变table和上边div的距离