檢視 HTML/適應word 的原始碼

[[分類:HTML]]
==2010==
<table>
<tr><th>寫html</th><th rowspan=2>→</th><th>用word讀</th><th rowspan=2>→</th><th>存docx或pdf</th><th rowspan=2>→</th><th>去7-11印</th></tr>
<tr><td>載入CSS</td>                    <td>可連圖照</td>                     <td>可連圖照</td><td>僅接受檔內的內嵌圖照<br/>不能顯示連結的圖照</td></tr>
</table>
===前置處理===
*雖會忽視「<!DOCTYPE html>」，但仍建議這樣寫，以便使用下一項<meta charset='utf-8' />。
*接受「<meta charset='utf-8' />」
*須&lt;html xmlns:w='urn:schemas-microsoft-com:office:word'&gt;才能進入整頁模式
*#xmlns：聲明名字空間，xml名字空間(namespace)。作用是使同名字的元素或屬性因隸屬不同的名字空間而可以區別。
*#w：名字空間的前綴，即等號後面的指示，用 w 為前綴來代表。
*#等號之後是名字空間的唯一標識符，是一個IRI(國際化資源標識符,Internationalized Resource Identifier)引用，但通常是一個URI(統一資源標誌符)引用。此例中是(uniform resource name)urn:架構們-微軟-com:辦公室軟體:文字處理。
*#名字空間的聲明就是：'''將一個前綴與一個URI關聯起來'''。
*#不直接使用命名空間的URI是因為URI為了唯一通常會很長，直接使用URI不但造成書寫和閱讀的不便，還會擾亂XML的語法。
*#聲明名字空間時，也可以不定義前綴。未定義前綴的名字空間將被用作預設的名字空間。
*#名字空間的URI僅僅是唯一的標識符，推薦規範不要求，也不建議通過其獲取信息。XML解析器處理名字空間URI時，也僅僅將其作為字符串。例如，地址為 http://www.w3.org/1999/xhtml 的文檔並不包含任何代碼，它僅僅為人類閱讀者描述了XHTML名字空間。之所以採用URI(如'http://www.w3.org/1999/xhtml')來標識名字空間是因與使用簡單的字符串(如xhtml)相比，URI大大降低了名字空間重名的可能性。
*#文檔中的元素名和屬性名可以加前綴(如xhtml:hr)也可以不加前綴(hr)。不加前綴就會被認為屬於預設名字空間，如果預設名字空間沒有定義，則屬於無名字空間。
*#可聲明取消已定義的名字空間，如：xmlns:xhtml=""。
*#當一個元素帶有屬性xmlns=""，該元素和它的後代被視為「無名字空間」。
*以整頁模式顯示：
<pre>
<!--[if gte mso 9]>
<xml>
 <w:WordDocument>
  <w:View>Print</w:View>
 </w:WordDocument>
</xml>
<![endif]--></pre>
*title標籤，決定頁名。
*以&lt;link rel='stylesheet' type='text/css' href='網址' /&gt;來載入樣式表
*style段落中
<pre>
@page 樣式值 {size:寬 長;margin:上 右 下 左;}
.nicetable {border:1px solid black;border-collapse:collapse;}
.nicetable td{border:1px solid black;border-collapse:collapse;}</pre>
*body 中 以&lt;div style='page:樣式值;'&gt;…&lt;/div&gt;包起文件內容
===方盒子模型(Box Model)===
{{:Box Model}}

===長度單位===
#百分比：對表格寬度有效，「style='width:百分比'」，可以帶小數點。對表格高度無效。
#無單位數字：對表格寬度和高度有效，圖照的長、寬，word只接受「width=無單位數字 height=無單位數字」。<br/>
而此數字代表多寬：
#*Word 2016 以上的版本，每英吋 96 點的設定，不受螢幕解析度設定的影響。
#*Word 2010 以下的版本，每英吋 96 點的設定，只適用螢幕解析度 100% 。由「控制台/外觀及個人/顯示/」控制，如：
#*:96dpi(100%)則 96 個寬度單位為1英吋
#*:120dpi(125%)則 120 個寬度單位為1英吋
#公分及 pt ：對表格的寬、高設定有效。pt固定設定每吋72pt。
#指定欄寬要有效，必須幾乎所有的 cell 都對其設有寬度。

===換頁===
&lt;br style='page-break-before:always' /&gt;

===將圖包在P標籤中===
*在表格中，P不要帶任何字，直接設P為「style='text-align:center;'」這時圖在會表格中水平置中。
*設P為「style='vertical-align:top;'」讓圖的上緣與字的上緣對齊。
*設P為「style='vertical-align:middle;'」讓字對圖垂直置中。

===表格榻陷===
如果表格整列都沒有內容，在 word 中會榻陷是極扁的列，此時在表格中加空白沒用，但加&amp;nbsp;即可避免表格榻陷。

===表格中的 &lt;li&gt; 會錯亂===
從 word 2007~2019 表格內的 &lt;li&gt; 會跨格從 1 往下編，無視 ul,ol,type,start,style='list-style-type:???' 。

解決的方法：到 [https://www.aconvert.com/tw/document/html-to-doc/ https://www.aconvert.com/tw/document/html-to-doc/] 去轉檔，再用 word 讀取，此時列點被轉成「外凸段落」才能正常顯示。

其他的 html-to-doc 尚未發現成功的例子。

===HTML 中圖靠右且文繞圖，不會表現===
#如果圖包在 div 中，由於 word 不承認 div ，所有 div 的屬性設定均不表現。
#如果圖包在 p 中， p 靠右會表現，但文繞圖不表現。
手動設定文繞圖的步驟：
#查出圖應有的長寬
#插入圖
#依 1. 調大小
#靠右
#設為文繞圖
#用「取代」用「空字串」換掉多餘的「^p」

===HTML 中將圖置於表中，整個表靠右且文繞圖，會表現===
但圖露出多少，受 line-height 設定影響，可以設「line-height:100%;」讓圖完整露出。

但 paragrap_u8.css 預設表格內 line-height:14pt; 解決方法有二：
#引用 class:.putInto ：會自動設定 line-height:100%; 並去除表格框線。
#用行內 style 去設定 line-height:100%; 及消除表格框線。

===HTML 中 border-collapse:separate ，無法表現===

==Microsoft 365 Word==
===載入 css 排版時===
# 忽略表格內的 padding 設置，一律設為 .75pt 。須手動調整表格的「儲存格邊界」。
# 對 table 設置 line-height 會被 th 和 td 重設
===字體波浪符偏上問題===
#華康與文鼎的半形波浪符「~」會偏上，但是細明體與標楷體沒有這個狀況
#*因為U+007E的設計不同字體不一樣
#*建議可以改成U+FF5E，或是全形波浪符(shift+enter 後 shift+~)