html根據DIRECTION設置改變元素的水平對齊

我有一個網站支持所有語言，包括RTL（希伯來語，阿拉伯語，波斯語等）。這些應用程序是使用AngularJS，Bootstrap和JavaScript開發的。html根據DIRECTION設置改變元素的水平對齊

通過設置dir="auto"我得到正確顯示的文本（LTR for ENGLISH，RTL for ARABIC）。我的問題是與元素的對齊。

假設您需要顯示一個列表。當語言，說英語，列表看起來：

- Entry 1; this is with a short tail, 
- Entry 2; no tail, 
- Entry 3; this is with a tail that is longer than the one of the 1st entry

如果這個名單將是，說阿拉伯語，它看起來如下：

دخول 1؛ هذا هو الحال مع ذيل قصير - 
دخول 2؛ بلا ذيل، - 
دخول 3؛ هذا هو الحال مع ذيل أطول من واحد من دخول 1ST -

，顯然不應該是正確的對齊，如：

      دخول 1؛ هذا هو الحال مع ذيل قصير - 
              دخول 2؛ بلا ذيل، - 
    دخول 3؛ هذا هو الحال مع ذيل أطول من واحد من دخول 1ST -

（我向大家致歉阿拉伯音箱，但我不是你們中的一個，並使用谷歌翻譯，所以我不知道翻譯的質量是什麼）。

那麼，有沒有辦法測試內容的字符集並設置horizontal-align:left或horizontal-align:right？

希望我的問題很明確...

在此先感謝。

2016-04-30 FDavidov

我找到了解決方案。有關收到數據的語言的指示。然後我設置div爲：

<div .... style="text-align:{{User_This_Align}}"> 
...

內的控制器，被設置變量$scope.User_This_Align等於「左」或取決於數據的語言「正確的」。

（這依賴於Angular的數據綁定功能）。

希望這個解決方案對任何有相同或相似需求的人都有幫助。

感謝那些發送了他們的意見。

2016-04-30 15:39:21 FDavidov

這很簡單。所有你需要做的是把如下放入一個css文件：

text-align：right; --------------將其對齊到右側

text-align：left; --------------將它對齊到左邊

text-align：center; --------------把它排在中心

2016-04-30 14:32:43

那麼，'text-align'的選項對我來說並不陌生。我的觀點是如何根據要在列表中部署的數據內容動態地改變它（從「左」到「右」，反之亦然）。 – FDavidov

你可以使用php，並根據它是什麼語言來創建一個變量。然後你可以有一個if語句來檢查變量是什麼。 –

感謝您的意見。我找到了如下所示的解決方案。 – FDavidov

首先嚐試在課堂上給予指導。（請參閱W3學校的CSS方向屬性）然後根據所選語言使用ng-class更改方向。

2016-04-30 14:37:54

問題是：我從數據庫中獲取文本，我不知道它是英文，阿拉伯文，中文還是其他。我需要找出哪種語言，然後將列表的對齊方式設置爲右側或左側。這是挑戰。 – FDavidov

當用戶選擇特定的語言選項時，你會得到文本嗎？ –

如果用戶選擇阿拉伯語或中文，你會傳遞一些代碼或ID到數據庫以獲取相關的語言數據。 –

回答