Autor publikacji
Virtual Patriot - Administrator

text-emphasis

Data publikacji
Ostatnio edytowano

Przeznaczenie właściwości text-emphasis

Za pomocą właściwości text-emphasis możemy określić kilka różnych cech dodatkowego symbolu, który powinien znaleźć się przy każdym znaku tworzącym tekst interesującego nas elementu HTML.

Informacje dodatkowe

brak

Informacje techniczne o właściwości text-emphasis

przeznaczenie

element HTML każdego typu

pozycja

dowolna

dziedziczenie

tak

wartość initial

none currentColor

wyjątki initial

brak

animowanie

tak samo jak dla poszczególnej właściwości CSS, której wartość tworzy poszczególny składnik grupy wartości właściwości text-emphasis

Interpretacja właściwości text-emphasis

Firefox

tak

Google Chrome

tak, lecz z przedrostkiem -webkit-

Safari

tak

Opera

tak, lecz z przedrostkiem -webkit-

Internet Explorer

nie

Edge

tak, lecz z przedrostkiem -webkit-

Zobacz więcej informacji o interpretacji właściwości .

Opis wartości właściwości text-emphasis

grupa wartości

Wyjaśnienie

Za pomocą właściwości text-emphasis oraz z góry zdefiniowanej grupy wartości możemy określić kilka różnych cech dodatkowego symbolu, który powinien znaleźć się przy każdym znaku tworzącym tekst interesującego nas elementu HTML.

/* OBIE REGUŁY CSS SĄ SOBIE RÓWNOZNACZNE */

/* REGUŁA - 1 */
div {
  text-emphasis:open triangle blue;
}

/* REGUŁA - 2 */
div {
  text-emphasis-style:open triangle;
  text-emphasis-color:blue;
}

Składniki grupy wartości właściwości text-emphasis

Przykładowe zapisy

open

open triangle

open triangle red

'^'

'^' #0F0

style

Składnik style nie jest wymaganym składnikiem grupy wartości właściwości text-emphasis. Składnik style określa wartość właściwości text-emphasis-style, czyli to, jaki dodatkowy symbol powinien znaleźć się przy każdym znaku tworzącym tekst interesującego nas elementu HTML.

color

Składnik color nie jest wymaganym składnikiem grupy wartości właściwości text-emphasis. Składnik color określa wartość właściwości text-emphasis-color, czyli kolor dodatkowego symbolu, jaki powinien znaleźć się przy każdym znaku tworzącym tekst interesującego nas elementu HTML.

Przykład

  text-emphasis:open double-circle red;
przykładowy tekst 電報碼碼

Przy każdym znaku tworzącym tekst przykładowego elementu "div" pojawił się dodatkowy symbol posiadający typ "open", kształt "double-circle" oraz kolor czerwony, ponieważ do wspomnianego elementu "div" została dodana właściwość "text-emphasis" wraz z następującą grupą wartości: "open double-circle red".

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        text-emphasis:open double-circle red;
        -webkit-text-emphasis:open double-circle red;
        padding:1em;
        font-size:2em;
        background-color:#7DCDE8;
      }
    </style>
  </head>

  <body>

    <div>
      przykładowy tekst 電報碼碼
    </div>

  </body>
</html>