從右至左支援

Foundation 可以輕鬆調整其元件,以配合從右至左閱讀的語言。

HTML

您需要對標記進行一些變更,才能讓 Javascript 元件順利運作。在 <html> 標籤中,您需要新增一個 dir 屬性,其值為 rtl。以下是 <html> 標籤應有的樣貌

<!-- This example is for a right-to-left Arabic layout -->
<html class="no-js" lang="ar" dir="rtl">

語言代碼

您需要變更 lang 屬性值,以符合您的語言。以下是常見從右至左語言及其 html 代碼的方便清單。

  • 阿拉伯語: ar
  • 波斯語: fa
  • 希伯來語: he, iw
  • 烏爾都語:ur
  • 意第緒語:yiji

在國會圖書館網站上檢視語言代碼完整清單


CSS 下載

如果您使用 Foundation 的 CSS 版本,您需要建立一個自訂下載,其中包含 RTL CSS,而非 LTR。只要在自訂器的文字方向區段中選取「由右至左」即可。


Sass 設定

如果您使用 Foundation 的 Sass 版本,請開啟您專案的設定檔 (settings.scss),並變更全域區段中的這個變數

$global-text-direction: rtl;

這會將架構的元件轉換為 RTL 格式。