具象化LinePalace
  • Home
  • 網頁技術
    • 學習筆記
    • 工具分享
  • 生活地圖
  • 科技新聞
  • 英語學習與留學
No Result
View All Result
  • Home
  • 網頁技術
    • 學習筆記
    • 工具分享
  • 生活地圖
  • 科技新聞
  • 英語學習與留學
No Result
View All Result
Linepalace凌品設計
No Result
View All Result
Home 網頁技術 學習筆記

線上表格生成器Tables Generator 詳細教學

rubykuo by rubykuo
September 28, 2023
in 學習筆記, 網頁技術
Reading Time: 3 mins read
線上表格生成器Tables Generator 詳細教學
76
VIEWS
Share on FacebookShare on Twitter

目錄

Toggle
  • Tables Generator讓懶人成為第一名工具!表格生成器
    • 一、操作方式說明
    • 二、使用表格生成器的優缺點
      • 優點:
      • 缺點:

Tables Generator讓懶人成為第一名工具!表格生成器

如何使用工具來幫助網站建立一個漂亮的表格呢?建議你可以試試這一個方便的線上工具!使用方式非常簡單,而且就算不懂程式也沒關係!一步一步帶你了解怎麼使用這個網頁工具,快來看看這是怎麼操作的吧!

一、操作方式說明

Step1.進入先將最上面的標籤切換到HTML

Step2.將其中的文件整理統一文件格式(word/Excel)例如:刪除多餘的空白鍵

Step3.複製整個文件的表格到欄位中(不需要一格一格的貼!)

如果文件比較大,也可以使用匯入csv文件的方式!非常方便!

Step4.編輯樣式

A.還原新增表格、刪除表格、上一步等

B.調整表格樣式,文字寬度、字形、大小、顏色等

C.表格面板與文字編輯

D.產生方案並複制

值得一提的是選擇,右上角的主題可以快速預設的表格樣式,超級方便的

Step5.計算原始碼

機器生成的原始碼限定了字形和寬度,一般我需要將網站默認的字體系列和字體大小設置刪除,另外將<table>標籤設置為寬度100%

最後就可以生成原始碼並複制(圖標D)貼到網站後台編輯器裡成功美美的表格啦!

快去試試看吧!https://www.tablesgenerator.com/

二、使用表格生成器的優缺點

優點:

  • 介面簡潔且直覺,基本上會用excel或word都可以輕鬆操作
  • 一鍵獲取表格原始碼
  • 調整款式可以直接查看預覽結果
  • 有預設的表格樣式可以選擇!

缺點:

  • 自動生成的原始碼很容易因為反覆蓋的樣式修改而產生過多多餘的類和样式,導致原始碼冗長、較難閱讀與維護
如果想要深入了解表格是怎麼被寫出來的可以看零基礎也能懂的 HTML表格
Tags: 增加工作效率工具分享
Next Post

零基礎也能懂的 HTML表格(內含快速生成表格資源)

rubykuo

rubykuo

中文系畢業,曾任電商網站PM,現職網頁設計師。 認為走過的每一步都有它的意義,並且會在未來成為重要的養份

Related Posts

Gratisography免費免註冊趣味創意圖庫 高解析圖片讓你與眾不同
工具分享

Gratisography免費免註冊趣味創意圖庫 高解析圖片讓你與眾不同

September 29, 2023
2種常用GIF螢幕錄製動畫工具-簡報、網頁必備,簡單易用免下載,線上螢幕錄影GIF
工具分享

2種常用GIF螢幕錄製動畫工具-簡報、網頁必備,簡單易用免下載,線上螢幕錄影GIF

October 17, 2023
功能強大的CSS預處理器讓coding事半功倍!
學習筆記

功能強大的CSS預處理器讓coding事半功倍!

September 26, 2023
加速前端開發! 你必須知道的Emmet!
學習筆記

加速前端開發! 你必須知道的Emmet!

September 26, 2023
網頁&社群圖片設計的好幫手Microsoft Designer APP新上架(圖多)
工具分享

網頁&社群圖片設計的好幫手Microsoft Designer APP新上架(圖多)

September 25, 2023
如何連結CSS樣式?一篇了解3大寫法與實際應用
學習筆記

如何連結CSS樣式?一篇了解3大寫法與實際應用

September 25, 2023
Next Post
零基礎也能懂的 HTML表格(內含快速生成表格資源)

零基礎也能懂的 HTML表格(內含快速生成表格資源)

POPUPAR

  • 線上表格生成器Tables Generator 詳細教學

    線上表格生成器Tables Generator 詳細教學

    0 shares
    Share 0 Tweet 0
  • coding菜鳥必備 線上程式編輯器codepen

    0 shares
    Share 0 Tweet 0
  • 零基礎也能懂的 HTML表格(內含快速生成表格資源)

    0 shares
    Share 0 Tweet 0
  • 如何連結CSS樣式?一篇了解3大寫法與實際應用

    0 shares
    Share 0 Tweet 0
  • 【文山早午餐推薦】悠閒愜意的虎斑咖啡(含菜單)

    0 shares
    Share 0 Tweet 0

RECENT NEWS

加拿大留學必須知道的:Pathway和語言學校名詞

加拿大留學必須知道的:Pathway和語言學校名詞

October 21, 2023
Gratisography免費免註冊趣味創意圖庫 高解析圖片讓你與眾不同

Gratisography免費免註冊趣味創意圖庫 高解析圖片讓你與眾不同

September 29, 2023
2種常用GIF螢幕錄製動畫工具-簡報、網頁必備,簡單易用免下載,線上螢幕錄影GIF

2種常用GIF螢幕錄製動畫工具-簡報、網頁必備,簡單易用免下載,線上螢幕錄影GIF

October 17, 2023
功能強大的CSS預處理器讓coding事半功倍!

功能強大的CSS預處理器讓coding事半功倍!

September 26, 2023
加速前端開發! 你必須知道的Emmet!

加速前端開發! 你必須知道的Emmet!

September 26, 2023

Categories

  • 學習筆記 (7)
  • 工具分享 (5)
  • 生活地圖 (1)
  • 網頁技術 (10)
  • 英語學習與留學 (1)

MORE ON TWITTER

  • Home
  • 網頁技術
  • 生活地圖
  • 科技新聞
  • 英語學習與留學
歡迎來信合作:ruby@linepalace.com

© 2023 Copyright ©2023 具象化 linepalace by rubykuo. All rights reserved.

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In
No Result
View All Result
  • Home
  • 網頁技術
    • 學習筆記
    • 工具分享
  • 生活地圖
  • 科技新聞
  • 英語學習與留學

© 2023 Copyright ©2023 具象化 linepalace by rubykuo. All rights reserved.