HTML自適應(yīng)表格制作

Dreamweaver的“表格式數(shù)據(jù)導入(T)”功能
依據(jù):Dw的“表格式數(shù)據(jù)導入(T)”功能可以將存有表格數(shù)據(jù)的UTF-8編碼的TXT文檔導入到軟件當中

制作UTF-8編碼的TXT文檔
我們將表格數(shù)據(jù)直接拷貝到新建的TXT面板中,文件>另存為...,在“另存為”菜單面板右下角的“編碼(E)”選擇“UTF-8”,保存


TIM截圖20180712123853.png

Dw的“表格式數(shù)據(jù)導入(T)”功能
在Dw中點擊菜單 文件>導入>表格式數(shù)據(jù)導入(T),選擇TXT文件,導入
這時候表格的基本數(shù)據(jù)已經(jīng)導入到DW中了,剩下的工作我們就可以編輯表格的基本樣式

三、表格的自適應(yīng)和單元格數(shù)據(jù)居中
以一個6X4的表格為例

<head>
<meta charset="utf-8">
  <style>
     td {text-align:center}
  </style>
  <!--CSS:所有單元格數(shù)據(jù)全部居中-->
<title>無標題文檔</title>
</head>
<body>
<table id="example" cellspacing="0" width="100%" border="1">
<!--建立一個ID為“example”的表格,文字內(nèi)容離邊框距離為0,寬度為100%(自適應(yīng)填充整個頁面),邊框線寬為1-->
<thead>
<tr>
    <td>編號</td>
    <td>準考證號</td>
    <td>姓 名</td>
    <td>專業(yè)名稱</td>
    <td>指導教師</td>
    <td>聯(lián)系電話</td>
</tr>
</thead>
 <tr>
    <td>10001</td>
    <td>0121********</td>
    <td>王思賢</td>
    <td>會  計</td>
    <td>孟翠湖</td>
    <td>137********</td>
</tr>
<tr>
    <td>10002</td>
    <td>1027********</td>
    <td>丁洪利</td>
    <td>會  計</td>
    <td>孟翠湖</td>
    <td>137********</td>
</tr>
<tr>
    <td>10003</td>
    <td>0106********</td>
    <td>張春霞</td>
    <td>會  計</td>
    <td>孟翠湖</td>
    <td>137********</td>
</tr>
</table>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容