Skip to content

Latest commit

 

History

History
31 lines (27 loc) · 967 Bytes

design_tw.md

File metadata and controls

31 lines (27 loc) · 967 Bytes

設計

座標與大小

除了固定值外，API 提供特殊符號來描述座標的位址與長寬大小：

  • % 比例
  • @ 位置
  • + 之後

大小

例如一個本文區域的寬高為 (1000, 600)：

  • width="15%" 全寬的 15%，結果為 width = 1000 * 0.15 = 150
  • width="@40%" 結束在全寬 40% 的位置，假設前一個欄右側座標在 150px，結果為 width = 1000 * 0.4 - 150 = 250
  • width="+60%" 剩餘可用寬度的 50%，假設之前所有欄位使用了 400px，結果為 width = (1000 - 400) * 0.6 = 360
  • width="+100%" 剩餘可用寬度，假設之前所有欄位使用了 760px，結果為 width = (1000 - 760) = 240

組合起來

<column width="15%" />      <!-- 150px -->
<column width="@40%" />     <!-- 250px -->
<column width="+50%" />     <!-- 360px -->
<column width="+100%" />    <!-- 240px -->

本文