Разница между text-align: end и right


В чем разница между text-align: end; и text-align: right;?

Когда я использую любой из них, я получаю тот же результат, но есть ли какие-либо различия?

2 3

2 ответа:

Согласно https://developer.mozilla.org/en/docs/Web/CSS/text-align :

  • end
    То же самое, что right, если направление слева направо и left, если направление справа налево.

  • right
    Встроенное содержимое выравнивается по правому краю линейного блока.

В основном вы используете end в тандеме с direction: [rtl|ltr] и end соответственно отрегулируете, в то время как правый всегда будет держать ваш текст в right независимо от того, какое направление вы зададите.

Https://jsfiddle.net/ths4kdmx/

.end {
  text-align: end;
}
.right {
  text-align: right;
}
.dir-ltr {
  direction: ltr;
}
.dir-rtl {
  direction: rtl;
}
<div class="dir-ltr end">
  End alignment in left-to-right direction
</div>
<div class="dir-rtl end">
  End alignment in right-to-left direction
</div>
<div class="dir-ltr right">
  Right alignment in left-to-right direction
</div>
<div class="dir-rtl right">
  Right alignment in right-to-left direction
</div>

Да есть, согласно css-трюкам:

В CSS3 также есть два новых значения: начало и конец. Такие ценности облегчите поддержку нескольких языков, например, английский язык-это язык слева направо (ltr) и арабский язык-это язык слева направо (rtl) язык. Использование "правого" и "левого" для значений слишком жестко и не делает адаптируйтесь по мере изменения направления. Эти новые значения действительно адаптируются:

1: start - то же, что" left "в ltr, то же, что" right " в rtl.

2: end - то же, что" right "в ltr, то же, что" left " в rtl.

Смотрите подробно здесь: text-align in CSS