Warning:
This wiki has been archived and is now read-only.

Css3-writing-modes

From HTML5 Chinese Interest Group Wiki
Jump to: navigation, search

書寫模式介紹

行內方向與文字雙向性

豎排文字介紹

行內級對齊

豎排文字排版介紹

盒相關抽象術語

盒的抽象布局

頁面流 ― 頁面進行方向

字形組合

附錄 A:字符與屬性

附錄 B:HTML 的雙向規則

附錄 C:Unicode 裡的豎排語言

附錄 D:固有大小

本章節具有規範性

CSS 排版有幾個用在不同布局計算的自動伸縮概念。本章節定義幾個更精確的術語以連結本規範的布局行為與其它模組使用的計算,也定義幾個寬度、高度的新關鍵字以讓網頁作者給元素指定透過這些尺寸計算得到的大小。

在這些定義中,明確尺寸是指不需要靠測量內容決定的大小:例:<length>、初始包含塊的大小、一個靠明確尺寸決定的 <percentage>。不明確尺寸是指不明確的大小。「不明確的可用長度」是無限大的。

屬性: width’, ‘min-width’, ‘max-width’, ‘height’, ‘min-height’, ‘max-height
新值: min-content|max-content|fill-available|fit-content
初始值: [CSS21] 裡定義
適用於: [CSS21] 裡定義
繼承: [CSS21] 裡定義
百分比: [CSS21] 裡定義
媒介: [CSS21] 裡定義
計算值: 若指定值是關鍵字,同指定值,其他情形在 [CSS21] 裡定義

CSS 裡有四種自動計算的長度(分別以下面定義用於寬度與高度屬性上的關鍵字表示):

min-content

CSS2.1§10.3.5 裡稱作「首選最小寬度」,在 CSS2.1§17.5.2.2 裡稱作「最小內容寬度」。最小內容 measure 粗略定義為在一個盒中「所有」斷行機會都發生時可以包括盒的內容的最窄 measure。

max-content

CSS2.1§10.3.5 裡稱作「首選寬度」,在 CSS2.1§17.5.2.2 裡稱作「最大單元寬度」。最大內容 measure 粗略定義為在一個盒中「沒有」斷行機會發生時可以包括盒的內容的最窄 measure。

fill-available

CSS2.1§10.3.5 裡稱作「可用寬度」,由 CSS2.1§10.3.5 裡的規則計算。充滿可用 measure 的計算方式是從可用 measure 剪掉元素的邊界、邊框、邊距再將結果截至零。若可用 measure 為無限大,則在本計算中使用後備可用 measure 取代可用 measure,除非額外註明,這也是初始包含塊的的 measure。充滿可用 extent 依相似的方式由塊方向對應的值算出。
議題六:郵件群中有改善「充滿可用 extent」定義的建議,參見 dbarontab 的郵件。

fit-content

CSS2.1§10.3.5CSS 多欄布局 § 3.4 裡稱作「收縮適應寬度」。適應內容 meausre 的定義為:若可用 measure 是有限的,適應內容 measure 為 max(min-content, min(max-content, fill-available)),否則,適應內容 measure 為最大內容 measure。適應內容 extent 在塊方向透過相同的表達式計算。

在 CSS2.1 的布局模型裡,非置換元素的最小內容 extent最大內容 extent 都定義為 CSS2.1§10.6.3CSS2.1§17.5.3 所(對橫排)定義的 ‘height: auto’ 元素的內容長度。

置換元素的最小最大尺寸一樣,對應於 ‘auto’ 寬度、高度計算決定的使用尺寸。

多欄布局的固有大小

根據 [CSS3COL],多欄元素的最小最大尺寸未定義。未來規範可能定義多欄元素的最小、最大尺寸。

屬性: column-widh
新值: min-content|max-content|fill-available|fit-content
初始值: [CSS3COL] 裡定義
適用於: [CSS3COL] 裡定義
繼承: [CSS3COL] 裡定義
百分比: [CSS3COL] 裡定義
媒介: [CSS3COL] 裡定義
計算值: 若指定值是關鍵字,同指定值,其他情形在 [CSS3COL] 裡定義

使用這些新值作為 ‘column-width’ 的時候,這些新關鍵字代表最佳欄位寬度:

min-content

設最佳欄位寬度為多欄元素內容的最小內容 measure

max-content

設最佳欄位寬度為多欄元素內容的最大內容 measure

fill-available

設最佳欄位寬度為多欄元素的充滿可用 measure

fit-content

設最佳欄位寬度為 max(min-content, min(max-content, fill-available))