div仿td標籤屬性

連接：https://pan.baidu.com/s/1kW1At9d 密碼：g0he

　　這裏說的div是指固定大小的，動態往裏面填充文字的時候，文字一直水平垂直居中（換行也是）。就和td標籤同樣。固然這個demo是針對文字的，若是有人問圖片和其餘固定大小的盒模型怎麼辦- -我只能說回去好好學學基礎，用「絕對定位」和「相對定位」呀。

　　廢話很少說，demo在文章頂部，這裏寫一下代碼介紹，此方法實現純靠CSS：

<style> .box{width:333px;height: 238px;display: table;} .cont{vertical-align: middle;display: table-cell;} h1{font-weight: inherit;font-size: 11px;text-align: center;} 
</style>
<div class="box">
    <div class="cont">
        <h1>一行字一行字一行字一行字</h1>
    </div>
</div>

　　以上代碼是簡潔型的代碼，具體效果還請下載demo查看。這個盒模型分爲三層，最外層的box須要定義寬、高、和display：table。第二層的cont須要定義

vertical-align: middle;display: table-cell;text-align: center;模仿td屬性，三個標籤的意思分別是：垂直居中，讓標籤元素以表格單元格的形式呈現（IE8+），水平居中。
最裏面的h1標籤你就能夠隨便定義啦，行高、顏色，字體大小。到這裏，你就能隨便往裏面動態生成數據啦，不再用擔憂換行或者顯示不下的問題了。