校務報告如何貼上表格

介紹在校務報告貼入表格的多種方式,包括截圖、內建表格及 Word 貼上,並說明表格過寬時的 HTML 修正方法。
校務系統・校務報告・表格

校務報告需要呈現表格時, 可以依內容與使用需求選擇「截圖貼上」、 「使用編輯器內建表格」或「直接從 Word 貼上」。 若 Word 表格在放大畫面後超出寬度, 也可以透過原始碼進一步修正。

📷
最快速 截圖後直接貼上。
▦
最穩定 使用系統內建表格。
📄
最方便 直接從 Word 複製表格。

1 方法一:截圖後貼上

如果表格主要是提供同仁查看, 不需要後續修改內容, 使用截圖通常是最簡單的方式。

1
開啟 Word, 先讓需要的表格在螢幕上完整呈現。
2
同時按下鍵盤 Windows 鍵 + Shift + S。
3
畫面會稍微變暗, 滑鼠游標會進入截圖選取狀態。
4
按住滑鼠左鍵, 框選要截取的表格範圍。
5
放開滑鼠後, 截圖會自動複製到剪貼簿。
6
回到校務系統的「報告內容」編輯畫面, 按下 Ctrl + V, 即可直接貼上圖片。
優點:
不容易跑版,放大或縮小畫面時, 表格外觀也比較穩定。

2 方法二:使用校務系統內建表格

如果希望表格內容可以直接在校務系統內修改, 可以使用編輯器本身的表格功能。

1
在「報告內容」編輯器中建立表格。
校務報告建立表格
2
建立完成後, 直接輸入各欄位的表格內容。
3
點選表格, 開啟 「表格屬性」→「進階」→「框線顏色」, 可將框線設定為白色或淺黃色, 讓畫面看起來較柔和。
校務報告表格屬性設定

3 方法三:直接從 Word 貼上

如果原本已經在 Word 製作好表格, 可以直接複製後貼到校務系統, 通常是最方便的方式。

1
在 Word 中選取整個表格, 按下 Ctrl + C 複製。
2
回到校務系統的「報告內容」編輯畫面, 按下 Ctrl + V, 即可直接貼上表格。
3
點選貼上的表格, 開啟 「表格屬性」→「一般」, 將寬度設定為 100%。
4
再到 「進階」→「框線顏色」, 可將框線設定為白色或淺黃色。
Word 表格貼入後設定表格屬性

4 Word 表格放大後超出畫面怎麼辦?

如果表格內容大部分都是數字, 在晨會或投影時使用 Ctrl + 滑鼠滾輪往前 放大文字後, 有時表格會超出畫面寬度, 造成右側內容無法完整顯示。

表格超出畫面寬度
這種情況通常是 Word 貼上的 HTML 保留了固定欄寬, 所以即使表格寬度設成 100%, 裡面的儲存格仍可能把整張表撐大。

5 進入「原始程式碼」修改表格

1
在校務報告編輯器中, 點選「原始程式碼」。
校務系統原始程式碼按鈕
2
找到以 <table class 開頭的表格標籤。

原本可能會看到類似:

<table class="MsoTableGrid" ...............>

將整個表格開頭標籤改成下面這一行:

<table class="MsoTableGrid" style="border-collapse: collapse; width: 100% !important; max-width: 100% !important; table-layout: fixed !important; overflow-wrap: anywhere; word-break: break-all;" border="1" cellspacing="0" cellpadding="0">
其中最重要的是 width:100%、 max-width:100%、 table-layout:fixed 及強制換行設定, 讓表格盡量限制在畫面寬度內。

6 刪除 <td> 裡面的固定欄寬

Word 貼上的表格, 常常會在每一個 <td> 儲存格裡面保留固定寬度。

例如可能看到:

<td style="width: 257.55pt; ...">

請把其中的:

width: 257.55pt;

刪除即可。 不同欄位的數值可能不一樣, 例如 100pt、180pt、257.55pt, 原則上就是移除 width: xxxpt; 這一段固定寬度。

找到 <td> → 找到 width: xxxpt; → 刪除固定寬度 → 儲存
修改完成後, 表格會比較容易依照瀏覽器寬度自動調整, 在放大文字或不同螢幕上顯示時也會比較穩定。

7 三種方式怎麼選?

A
只要看,不需要修改:
建議使用「截圖後貼上」, 最不容易跑版。
B
表格不複雜,而且希望能直接修改:
建議使用校務系統內建表格。
C
Word 已經做好完整表格:
可以直接複製貼上; 如果表格太寬, 再依本文方式修改原始碼。
⭐ 最簡單的判斷方式

只需要展示 → 用截圖 | 需要修改 → 用表格 | Word 已做好 → 直接貼上

文章搜尋

發現文章內容有誤或需要更新嗎?

如果您發現文章內容有錯誤、操作方式已變更,或資訊已不合時宜,歡迎聯繫資訊組告知,資訊組會確認並適時修正。
東興國小資訊組