Table
maker
表構建器和設計器是一個易於使用的網站，您可以免費使用該網站，插入表數據並編輯設計。
簡單
自訂
高級
語言
English
Arabic - العربية
Chinese - 中文
Spanish - Español
Japanese - 日本人
German - Deutsche
Russian - русский
French - français
Indian - भारतीय
Portuguese - Português
Turkish - Türkçe
設計簡單
桌子顏色
藍色
綠色
灰色
橙子
棕色
黑色
無色
顏色填充
頁眉和行
僅標題
沒有
懸停時表格行突出顯示
定制設計
背景顏色
主色
標題背景
行背景
行有兩種顏色
當您將鼠標懸停在它上面時
行背景
單元格背景
邊框屬性
邊境
邊框顏色
邊框樣式
固體
虛線
點綴
雙
槽
嶺
插圖
一開始
寬度
邊界半徑
時間表
細胞
字體顏色
文字屬性
桌子方向
右到左
左到右
汽車
標題文本
字體系列
默認字體
Arial
Roboto
Times New Roman
Times
Courier New
Courier
Verdana
Georgia
Palatino
Garamond
Bookman
Comic Sans MS
Candara
Arial Black
Impact
Open Sans
Pangolin
Russo One
Lobster
Antic Slab
Bebas Neue
Comfortaa
Exo 2
Shadows Into Light
Do Hyeon
Monda
Fredoka One
Righteous
Caveat
Maven Pro
Rajdhani
Bangers
Architects Daughter
Kalam
Great Vibes
Patrick Hand
字體大小
文字對齊
對
剩下
中央
默認
字體顏色
光標經過時
單元格文字
字體系列
默認字體
Arial
Roboto
Times New Roman
Times
Courier New
Courier
Verdana
Georgia
Palatino
Garamond
Bookman
Comic Sans MS
Candara
Arial Black
Impact
Open Sans
Pangolin
Russo One
Lobster
Antic Slab
Bebas Neue
Comfortaa
Exo 2
Shadows Into Light
Do Hyeon
Monda
Fredoka One
Righteous
Caveat
Maven Pro
Rajdhani
Bangers
Architects Daughter
Kalam
Great Vibes
Patrick Hand
字體大小
文字對齊
對
剩下
中央
默認
字體顏色
光標經過時
保存
隨機樣式
查看保存的樣式
樣式選項
模式
固定頭
垂直和水平突出顯示
版
馬睡眠
V 1.0
V 2.0
V 3.0
V 4.0
V 5.0
桌子方向
右到左
左到右
汽車
寬度和高度
寬度
px
%
高度
寬度第一欄
px
表格文字
測試
表格填寫
進階編輯
表結構
在表格單元格中添加佔位符信息
列
行數
首先，填寫下表中的單元格。
×
放置標題
最佳
側
無標題
單元格之間的分隔符
,
،
TAB
","
|
距離
自定義分隔符
自定義分隔符
暫時保存表格
刪除
保存的表
注意：
退出此頁面後，所有已保存的表格將被刪除。
×
預習
預習
注意：
表格大小大於為預覽指定的大小！ 請在新標籤頁中預覽。
在新標籤頁中預覽
從表格中刪除文字
碼
複製
緊湊的CSS
緊湊的html
<table class="awtable"> <thead> <tr> <th contenteditable="true">Header 1</th> <th contenteditable="true">Header 2</th> <th contenteditable="true">Header 3</th> </tr> </thead> <tbody> <tr> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> </tr> <tr> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> </tr> <tr> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> </tr> <tr> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> <td contenteditable="true"><br></td> </tr> </tbody> </table>
<div class="wrap-table100"> <div class="table100 ver3 m-b-110"> <div class="table100-head"> <table> <thead> <tr class="row100 head"> <th contenteditable="true" class="cell100 column1">Header 1</th> <th contenteditable="true" class="cell100 column2">Header 2</th> <th contenteditable="true" class="cell100 column3">Header 3</th> <th contenteditable="true" class="cell100 column4">Header 4</th> </tr> </thead> </table> </div> <div class="table100-body js-pscroll"> <table> <tbody> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1">cell 1</td> <td contenteditable="true" class="cell100 column2">cell 2</td> <td contenteditable="true" class="cell100 column3">cell 3</td> <td contenteditable="true" class="cell100 column4">cell 4</td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> <tr class="row100 body"> <td contenteditable="true" class="cell100 column1"><br /></td> <td contenteditable="true" class="cell100 column2"><br /></td> <td contenteditable="true" class="cell100 column3"><br /></td> <td contenteditable="true" class="cell100 column4"><br /></td> </tr> </tbody> </table> </div> </div> </div>
<div class="wrap-table100"> <div class="table100 ver3 mx-auto my-3"> <table data-vertable="ver3"> <thead> <tr class="row100 head"> <th contenteditable="true" class="column100 column1" data-column="column1"></th> <th contenteditable="true" class="column100 column2" data-column="column2">SUNDAY</th> <th contenteditable="true" class="column100 column3" data-column="column3">MONDAY</th> <th contenteditable="true" class="column100 column4" data-column="column4">Header 4</th> <th contenteditable="true" class="column100 column5" data-column="column5">Header 5</th> </tr> </thead> <tbody> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1">Jane Medina</td> <td contenteditable="true" class="column100 column2" data-column="column2">8:00 AM</td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1">Lawrence Scott</td> <td contenteditable="true" class="column100 column2" data-column="column2">9:00 AM</td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> <tr class="row100"> <td contenteditable="true" class="column100 column1" data-column="column1"> -- </td> <td contenteditable="true" class="column100 column2" data-column="column2"> -- </td> <td contenteditable="true" class="column100 column3" data-column="column3"> -- </td> <td contenteditable="true" class="column100 column4" data-column="column4"> -- </td> <td contenteditable="true" class="column100 column5" data-column="column5"> -- </td> </tr> </tbody> </table> </div> </div>
保存樣式
×
保存的樣式
請稍候...
Your Name
*
樣式名稱
*
電子郵件
*
您確定要刪除文本嗎？
請選擇您要刪除的內容