聲明本檔xml中w前綴所代表的名字空間 導入串接樣式定義: 之中只能用一次@import,要import兩個檔要用兩次。 --> 或 文章的標題 選用語言為中文-台灣
------------------+ 載入外部串接樣式表| ------------------+ 一、兩種方法比較 1.link是XHTML標籤;@import是CSS2.1提供的指令,IE5以上的才能識別。 2.link標籤除了可以載入CSS外,還可以做很多其它的事情,比如定義RSS,定義rel連接屬性等;@import就只能載入CSS 3.當一個頁面被加瀏覽載入時,link引用的CSS會同時被載入,而@import引用的CSS會等到頁面全部被下載完再被載入。 4.用javascript控制dom去改變樣式的時候,只能使用link標籤,因為@import不是dom可以控制的。 二、兩種協定的差別 1.@import url();和link的href屬性,都可以使用多種協定。 2.用瀏覽器透過網頁伺服器讀網路上的檔案會用http協定,用瀏覽器不透過網頁伺服器讀本機上的檔案會用file協定。 3.兩種協定的相對路徑表示法都一樣。 4.http協定的絕對路徑,從「/」開始,後面接子目錄;file協定「/磁碟機:或|…」之後才接次目錄。帶磁碟機的路徑,http絕對沒有辦法識別。 5.所以要讓外部css不論從網路或本機都能順利讀取,只能用相對路徑,不可能用絕對路徑。 ----------+ page的定義| ----------+ page是性質(property),@page {…}的設定,適用於全份文件。 page是保留字不能用其他字取代,但其「值」的名字可以隨意選隨意定,如B5、PN等。 page的各種值用@page 值 { }加以定義。節名是page的一個值,@page 節名 {}定義節的外觀 取用page值的方式有三種: 1.
…; 不能用
,這樣只有最後一個值會生效。 2.在Head中Style段中定「div.物件名 {page:值1;}」,在body中用
3.在別的檔定「div.物件名 {page:值1;}」,在Head中Style段中以@import叫入,在body 中用
。 定義各種page值可用的描述有: size:寬 長; margin:天 右 地 左 mso-page-orientation:landscape 橫放 mso-header-margin:頁首大小 mso-footer-margin:頁尾大小 頁首頁尾塞什麼 mso-header:url('') id mso-footer:url('') id mso-even-header:url('') id mso-even-footer:url('') id mso-first-header:url('') id mso-first-footer:url('') id mso-page-numbers-style:已被mso-page-numbers:取代 mso-page-numbers:格式 起始頁碼(格式可省略,省略為1,2,3…), 諸格式:num-in-dash(- 1 -),decimal-full-width(全形),alpha-lower(a),alpha-upper(A),roman-lower(i),roman-upper(I), decimal-enclosed-circle(圈中包數字),ideograph-digital(一),ideograph-legal-traditional(壹,貳,參), ideograph-traditional(甲),ideograph-zodiak(子,丑) ideograph表意文字 legal正式 zodiak黃道十二宮 mso-page-numbers-chapter-style:header-1;是否包含章節編號如1-1,1-A mso-page-numbers-chapter-separator:省略代表預設值連字號(-),period句號(.),colon冒號(:),em-dash長破折號(),en-dash短破折號();章節編號和頁碼用什麼隔開 mso-title-page:yes或no 首頁不印頁碼 紙張來源 mso-paper-source:首頁來源代碼 其餘各頁來源代碼 代碼:0預設紙匣、15自動選取、7自動送紙器 諸欄等寬 mso-columns:欄數 even 欄距; 諸欄不等寬 mso-columns:欄數 not-even 欄寬 欄距 欄寬 欄距…; mso-column-separator:none或solid; ※word2000-2003換算pt及cm,以每英吋72pt計算。 用於br之屬性 clear=all ,清掉之前的屬性 ----------+ 跳頁的用法| ----------+
-------------------------------------------------------------+ 自下個偶數頁起,常和換節併用,表示下一節須自偶數頁始,跳1-2頁| -------------------------------------------------------------+
-------------------------------------------------------------+ 自下個奇數頁起,常和換節併用,表示下一節須自奇數頁始,跳1-2頁| -------------------------------------------------------------+
----------------------------------------------------------+ 接續本頁,常和換節併用,表示下一節接在本頁未完之後,不跳頁| ----------------------------------------------------------+
----------+ 跳欄的用法| ----------+
----------+ 換節的用法| ----------+
mso-break-type到目前只發現一值,即section-break ----------+ 換行的用法| ----------+
----------+ 紙張的定義| ----------+ @page B5 {size:515.95pt 728.6pt;margin:36.85pt 42.55pt 48.2pt 42.55pt; mso-header-margin:0cm;mso-footer-margin:19.85pt;} div.B5 {page:B5;} 名稱 值 定義性質page的值B5為:紙張大小、上下、邊界。 再定義一個名稱叫B5的div的物件。 ----------+ 頁碼的定義| ----------+ +--------+ |警告訊息| +--------+ Html在依mso-footer:的指示找"某檔"時,會去找「檔名.files/filelist.xml」。 找不到會有警告訊息,但沒關係;找到了,就算是空檔,也不會有警告訊息。 Word2000只要html中有url("檔名")去參照檔案,就會去找html檔名.files之下的filelist.xml ,依賴其中對主檔及相關諸檔的路徑指示,去找出相關的檔案來。 如果找不到就會秀出「這個Web畫面中的某些檔案不存預期的位置,您要這樣做嗎?您應該按『是』,如果您確定此文件來自信任的來源。」 按是之後,還是會按html中的url("檔名")參照,去找到參照檔進行參照。 即使改指向其他檔也一樣會出警告訊息。 url(),指向檔案本身時,不會有警告訊息。 +--------+ |頁尾樣式| +--------+ @page PN {mso-footer:url("某檔") f1;} 指示頁尾「樣板」存放檔,及頁尾「樣板」的物件ID(此處為f1) url("某檔")和"url(某檔)"等效,而且相對路徑、絕對路徑都可用。 指示路徑時,即使在windows的檔案系統中,也要用「/」分隔,不可用「\」分隔。 定義樣式page的值PN為:取"某檔"中mso-element:footer且id=f1值的物件來做為頁尾「樣板」,拿來塞進每一頁的頁尾。 由於頁尾「樣板」不但要描寫物件的諸樣式,還要描寫物件中的顯示「內容」,所以已經不是純樣式,而是樣板了;無法用樣式定義加以解決。 指示存放檔一定要加url(),某檔外可加引號可不加引號。 +--------+ |頁尾樣板| +--------+
- x -
在"某檔"中可以有一堆不同的mso-element:footer的「頁尾樣板」,給它們不同的id,然後就可以在Html中以id指定其一。 此「頁尾樣板」(即mso-element)是一個div,內含一個span,此span為 mso-field-code:PAGE (即在每一頁印出頁碼)。 +--------------+ |頁尾樣板的位置| +--------------+ 一、放在該檔本身 1.放在該檔本身Head或Body之外,頁碼是不顯示。即使url指向本身也沒用。外面加會使其失效(被忽略),所以不能加。 .放在 前 .放在 與之間 .放在Head與Body之間 .放在 與之間 .放在 後 2.放在之間,使得樣式定義不再是樣式定義,而變成顯示內容。 3.放在Head內或Body內,有效,但文件顯示時會多一列「-x-」,不好看。 可以在div的style屬性中加上visibility:hidden;,使其在瀏覽器中不出現。 二、放在Html自身以外的"某檔" 4.參照正常,並且文件顯示時不會多一列「-x-」。 +--------------+ |常用的頁尾樣板| +--------------+ 代表秀頁碼 X 代表秀頁數 X 代表日期 DATE \@ "yyyy/M/d" X 代表時間 TIME \@ "AMPM hh:mm" X 日期可用格式 M代表月d代表日yyyy代表年 時間可用格式hh代表小時,mm代表分,AMPM代表「上午/下午」,am/pm代表「AM/PM」 +------------------+ |頁尾樣板的預設樣式| +------------------+ 如頁尾樣板改為如下形式,引用MsoFooter預設樣式,則尺寸改為10pt。

- x -

而這
這兩個物件,再加其他樣式描述都不生效。要加得在span外包p,在p中描述增加的樣式(如尺寸等)才會生效。 所以class=MsoFooter只能給p用,給span,div用都不生效。 MsoFooter預設樣式之預設值如下: p.MsoFooter, li.MsoFooter, div.MsoFooter {margin:0cm; 邊0 margin-bottom:.0001pt; 下邊幾近0 mso-pagination:none; 分頁:none無,widow-orphan不明。widow(寡婦)orphan(孤兒) tab-stops:center 207.65pt right 415.3pt; 位置,紙寬595.3-90×2=415.3;415.3/2=207.65。 layout-grid-mode:char; 頁面格點模式:字元。 font-size:10.0pt; 尺寸10pt font-family:"Times New Roman"; 字體 mso-fareast-font-family:新細明體; 遠東字體 mso-font-kerning:1.0pt;} 字距1pt 有時 font-family:新細明體; 字體 mso-fareast-font-family:標楷體; 遠東字體 mso-hansi-font-family:新細明體; 漢系字體 mso-bidi-font-family:"Times New Roman";} 二維字體 ----------+ 封面的處理| ----------+ @page COVER {mso-page-numbers:0;mso-title-page:yes;} div.COVER {page:COVER;} 封面不印頁碼,次頁印出頁碼1。首頁起始頁碼為0,但首頁不印出頁碼。 ----+ 單欄| ----+ @page One_C {mso-columns:1} div.One_C {page:One_C;} ----+ 雙欄| ----+ @page TWO_C {mso-columns:2 even 14.17} div.TWO_C {page:TWO_C;} 分為左右兩欄,等分,欄寬 ---------+ pre的用法| ---------+
pre如果未指定字形,會選取調和字,導致表格及字對不整齊。而細明體是非調和字。可以順便指定尺寸及行高。

----------+
表的邊框  |
----------+
table,th,td {border:0.51pt solid black;BORDER-COLLAPSE:collapse;}
就足可使IE,FF,word產生單線黑框的表格,線寬0.5pt。完全不需要用mso-border-alt:solid .5pt;再修飾。
word2000
完全忽略table的border樣式指示,只管td的border樣式指示。

IE4
預設有邊框,依style='border-style:none|solid;'決定有無邊框,不理會border=

IE3
預設沒有邊框,依border=0|1決定有無邊框,不理會style='border-style:'

Mozilla及IE5,Word 2000
預設沒有邊框,border=0|1決定有無邊框,style='border-style:none|solid;'決定有無邊框。
兩者都有指令時:Mozilla以
         Mozilla  IE5   Word 2000
0,none   無框     無框  無框
0,solid  無框     單框  單框
1,none   單框     單框  單框
1,solid  雙框     雙框  雙框

所以導致超文件中,兩種指令都要加

firefox 看表框線的寬度,只看css中 border:線寬(pt) 線型

--------+
表的寬度|
--------+
Word2000解讀時三種單位均有效。其中百分比指佔頁高扣去天地後的百分比。
            只對無單位數字有效。

Word2010解讀
中 width=數字 或 style='width:數字',其寬度單位有三類: 1.百分比:對兩者都有效,但width=不能帶小數點,style='width:可以帶小數點。效力大於表格自動撐開及收縮。 2.無單位數字:對width=數字 有效,對style='width:數字' 無效。但效力仍小於表格自動撐開,大於表格自動收縮。 而此數字代表多寬,由winXP由「控制台/顯示器/設定/一般/字型大小」控制,win7由「控制台/外觀及個人/顯示」控制: 如96dpi(100%)則96個寬度單位為1英吋;120dpi(125%)則120個寬度單位為1英吋。 3.公分及 pt :對width=數字 無效,對style='width:數字' 有效。但效力仍小於表格自動撐開,大於表格自動收縮。 固定每吋72pt。 ※要壓制表格自動撐開,又要使用小數點求定位精確,唯一的選擇只有style='width:百分比'。 Word2000解讀
時無單位數字、cm、pt三種單位均有效,百分比無效。 只對無單位數字有效。 --------+ 圖的寬度| --------+ Word2010 style='width:數字;height:數字;' 對無單位、百分比、pt、cm 皆無效 width=數字 height=數字 對百分比無效、pt、cm 皆無效,對無單位有效,但不可使用auto。無單位長度定義同上段。 --------+ 表的美化| --------+ 以cellspacing=0時,
中 width=數字 或 style='width:數字',其寬度單位有三類: 1.百分比:對兩者都有效,但width=不能帶小數點,style='width:可以帶小數點。效力大於表格自動撐開及收縮。 2.無單位數字:對兩者都有效。效力大於表格自動撐開及收縮。 而此數字代表多寬,由[控制台/顯示器/設定/一般/字型大小]控制, 如96dpi(100%)則96個寬度單位為1英吋;120dpi(125%)則120個寬度單位為1英吋。 3.公分及 pt :對width=數字 無效,對style='width:數字' 有效。效力大於表格自動撐開及收縮。 固定每吋72pt。 ※要壓制表格自動撐開,又要使用小數點求定位精確,選擇有:百分比及無單位數字。 Word2010解讀
鄰接處,同一個地方畫兩次,線會變粗,在 style=中下BORDER-COLLAPSE:collapse;屬性,會讓線只畫一次。但只對word有效,對瀏覽器無效。 -----------------+ 邊框的樣式(div等)| -----------------+ border-radius:圓角的半徑,預設為0,即無圓角 border-top-left-radius:左上圓角的半徑 border-top-right-radius:右上圓角的半徑 border-bottom-left-radius:左下圓角的半徑 border-bottom-right-radius:右下圓角的半徑 border-style:框線的樣式,有none、solid、dashed、dotted、double border-width:框線的粗細 border-color:框線的顏色 style:綜合樣式、粗細、顏色 ----------------+ 微軟的項目及編號| ----------------+ 微軟表內的 li 編號會跨格子連續一直往下編,此無解,最好不要用 @list 值 {mso-level-text:□;margin-left:18pt;text-indent:-18pt;mso-level-tab-stop:18.0pt; mso-list-type:hybrid;} mso-level-text:行首字符,mso-level-tab-stop:行首向右多少,開始接行首字符之後的文字。 ※word2000換算pt及cm,以每英吋72pt計算。 +--------------------------------------------+ | word2000如何決定項目、編號、大綱 | +----------------------+---------------------+ | |mso-list-type:hybrid;| +----------------------+----------+----------+ | mso-level-text: | 有 | 無 | +----------------------+----------+----------+ |mso-level-text:接變數;| 編號 | | |(mso-level-text:%1;) | | | +----------------------+----------| 大綱 | |mso-level-text:接字元;| 項目 | | |(mso-level-text:□;) | | | +----------------------+----------+----------+ +-------------+ |@list專用定義| +-------------+ mso-level-tab-stop:長度; 行首向右多少,開始接行首字符之後的文字。 mso-level-number-position:left; 不知道幹嘛,可省略 mso-level-start-at:幾; 從幾數起 字體格式: 無mso-level-number-format: 代表1,2,3 mso-level-number-format:alpha-upper; 代表A mso-level-number-format:roman-upper; 代表I mso-level-number-format:roman-lower; 代表i mso-level-number-format:ideograph-traditional; 代表甲 mso-level-number-format:taiwanese-counting-thousand;代表一 mso-level-number-format:ideograph-legal-traditional;代表壹 mso-level-number-format:bullet; 代表無序(配合項目符號,可無) 行首樣板: mso-level-text:字元; 代表項目 mso-level-text:%1; mso-level-text:%1、; mso-level-text:(%1); %1第一層之次序 %2第二層之次序 無mso-level-text:,無mso-level-number-format:bullet;,代表編號,行首為「1+.」 無mso-level-text:,有mso-level-number-format:bullet;,代表編號,行首為「空白+.」 +-----------------+ |@list中定義之效力| +-----------------+ 有效:字體,尺寸,字距,內縮,外凸,平移,(水平參數) 無效:margin,行高 (垂直參數) +----+ |引用| +----+ 引用style='mso-list:值', 但需要設定垂直參數時,加「.類名 {mso-list:值;其他樣式…}」再用class=類名引用。 +--------------------------------------+ |防止行首字符和項目內容有空白的簡單方法| +--------------------------------------+ body設tab-interval:0pt,即tab之間距離均為0,即無tab可言。 --------+ 文字排列| --------+ TEXT-ALIGN:LEFT︱RIGHT︱CENTER︱JUSTIFY (左,右,中,對齊) text-justify: 文字如何對齊 auto:由瀏覽器語系決定 inter-word:利用調整字距(word間的距離) newspaper:利用調整字距或字母間距 distribute:與newspaper很像,但最適用於東亞 inter-ideograph:利用增加或減少字距來調整 distribute-all-lines:連最後一行也調整至同寬,一般不會用這個值 前五種,最後一行不對齊右邊,其他各行離右邊界太遠也不對齊,離右邊界一個字時,把與邊界間的空白攤入字間。 第六種,末行不管離邊界多遠,都把與邊界的空白攤入字間。 對齊對firefox無作用,對word,IE5以上有作用 --------------+ 對齊格線的方向| --------------+ layout-grid-mode: none:不與格線對齊 both:縱向,橫向都與格線對齊 line:只有縱向對齊 char:只有橫向對齊