Text-underline-position - CSS-trükkök

Anonim

A text-underline-positiontulajdonság beállítja az aláhúzás elhelyezését a linkeken vagy az text-decoration: underline;alkalmazott szövegeken .

a ( text-underline-position: under; )

Értékek

Ezek a W3C CSS szövegdekorációs modul 3. szintű pályázói ajánlásában megadott értékek:

  • auto: az alapértelmezett. A böngésző dönt arról, hogy az aláhúzást a szöveg alapvonalához vagy alá helyezi-e.
  • inherit: örökli a szülő aláhúzási helyzetét.
  • under: helyezze az aláhúzást a szöveg alá külön szóközzel, hogy megakadályozza az utódok keresztezését.
  • left: függőleges írási módokhoz. Ez a sort a szövegtől balra helyezi.
  • right: függőleges írási módokhoz. Ez a sort a szövegtől jobbra helyezi.

A Microsoft más értékkészletet használ az Internet Explorer programhoz:

  • auto: az alapértelmezett. Helyezze az aláhúzást a szöveg alá minden nyelvre, kivéve a japánt (a részletekért lásd az MSDN linket az alábbi „További információk” részben).
  • above: az aláhúzást a szöveg fölé helyezi. Vizuálisan azonostext-decoration: overline;
  • below: az aláhúzást a szöveg alá helyezi. Ne feledje, hogy ez különbözik under- ez nem fogja tisztázni az utódokat.
  • auto-posugyanúgy működik, mint a auto.

Demó

Az írás idején text-underline-positioncsak részben támogatja a Chrome (33+ és engedélyezett kísérleti jelzőkkel) és az Internet Explorer 6+. A Chrome támogatja a auto, inherités underértékeket a W3C jelölt ajánlásból, míg az IE saját alternatív értékeit.

Ez a bemutató megmutatja az őket támogató böngészők underés belowértékeit.

Lásd a CSS-Tricks (@ css-tricks) tollal írt aláhúzási pozícióját a CodePen-en.

Összefüggő

  • szövegdíszítés

Több információ

  • text-underline-position a CSS szövegdekorációs modul CR 3. szintjén.
  • text-underline-position az MSDN-nél.

Böngésző támogatás

Króm Szafari Firefox Opera AZAZ Android iOS
33 * Egyik sem Egyik sem Egyik sem 6 † Egyik sem Egyik sem

* -webkitelőtaggal és kísérleti jelzőkkel engedélyezve a chrome: // flags szolgáltatásban. leftés az rightértékek nem támogatottak.
† -mselőtaggal és IE-specifikus értékekkel.