この記事はまだボランティアによって 日本語 に翻訳されていません。ぜひ MDN に参加して翻訳を手伝ってください!
この記事を English (US) で読むこともできます。

Summary

The CSS text-underline-position property specifies the position of the underline which is set using the text-decoration property underline value.

This property inherits and is not reset by the text-decoration shorthand, allowing to easily set it globally for a given document:

:root { /* Better default for document with a lot of chemical formulas */
  text-underline-position: under;
}

Initial valueauto
Applies toall elements
Inheritedyes
Mediavisual
Computed valueas specified
Animation typediscrete
Canonical orderorder of appearance in the formal grammar of the values

Syntax

/* Keyword values */
text-underline-position: auto;
text-underline-position: under;
text-underline-position: left;
text-underline-position: right;
text-underline-position: under left;
text-underline-position: right under;

/* Global values */
text-underline-position: inherit;
text-underline-position: initial;
text-underline-position: unset;

Values

auto
This keyword allows the browser to use an algorithm to choose between under and alphabetic.
under
This keyword forces the line to be set below the alphabetic baseline, at a position where it won't cross any descender. This is useful to prevent chemical or mathematical formulas, which make a large use of subscripts, to be illegible.
left
In vertical writing-modes, this keyword forces the line to be placed on the left of the characters. In horizontal writing-modes, it is a synonym of under.
right
In vertical writing-modes, this keyword forces the line to be placed on the right of the characters. In horizontal writing-modes, it is a synonym of under.
auto-pos
This keyword is a synonym of auto which must be used instead
above
This keyword forces the line to be above the text. When used with East-Asian text, using the auto keyword will lead to a similar effect.
below
This keyword forces the line to be under the text. When used with alphabetic text, using the auto keyword will lead to a similar effect.

Formal syntax

auto | [ under || [ left | right ] ]

Specifications

Specification Status Comment
CSS Text Decoration Level 3
The definition of 'text-underline-position' in that specification.
Candidate Recommendation Initial definition

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support (auto) 33.0 (Yes) No support 6[1] No support No support
under 33.0 ? No support No support No support No support
left, right No support[2] ? No support No support No support No support
above, below No support ? No support 5[1] No support No support
auto-pos No support ? No support 6[1] No support No support
Feature Android Chrome for Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support No support (Yes) No support ? No support No support

[1] Internet Explorer implements different values, with somewhat different effects for this value. From IE 5 to IE 7, included, only a non-prefixed version existed. From IE 8 onwards, the prefix can be used.

[2] See Chrome Issue 313888

See also

ドキュメントのタグと貢献者

 最終更新者: erikadoyle,