Wartość mixed
jest domyślną wartością właściwości text-orientation
.
Domyślnie znaki tworzące tekst elementu HTML, który posiada pionowy tryb zapisu treści, obrócone są o 90 stopni zgodnie z ruchem wskazówek zegara, lecz zasada ta nie tyczy się znaków tworzących tekst azjatycki.
text-orientation:mixed;
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
Znaki (nieazjatyckie) tworzące tekst przykładowego elementu "div", który posiada pionowy tryb zapisu treści, zostały obrócone o 90 stopni zgodnie z ruchem wskazówek zegara.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
writing-mode:vertical-lr;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
</div>
</body>
</html>
Za pomocą wartości upright
właściwości text-orientation
możemy sprawić, że znaki tworzące tekst interesującego nas elementu HTML, który posiada pionowy tryb zapisu treści, nie zostaną obrócone o 90 stopni zgodnie z ruchem wskazówek zegara.
text-orientation:upright;
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
Znaki tworzące tekst przykładowego elementu "div", który posiada pionowy tryb zapisu treści, nie zostały obrócone o 90 stopni zgodnie z ruchem wskazówek zegara, ponieważ do wspomnianego elementu "div" została dodana właściwość "text-orientation" wraz z wartością "upright".
<!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-orientation:upright;
-webkit-text-orientation:upright;
writing-mode:vertical-lr;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
</div>
</body>
</html>
Za pomocą wartości sideways
właściwości text-orientation
możemy sprawić, że wszystkie znaki tworzące tekst interesującego nas elementu HTML, który posiada pionowy tryb zapisu treści, zostaną obrócone o 90 stopni zgodnie z ruchem wskazówek zegara.
text-orientation:sideways;
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
Wszystkie znaki tworzące tekst przykładowego elementu "div", który posiada pionowy tryb zapisu treści, zostały obrócone o 90 stopni zgodnie z ruchem wskazówek zegara, ponieważ do wspomnianego elementu "div" została dodana właściwość "text-orientation" wraz z wartością "sideways".
<!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-orientation:sideways;
-webkit-text-orientation:sideways;
writing-mode:vertical-lr;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
to jest jakiś przykładowy tekst znajdujący się w obszarze zawartości tego elementu "div" 電報碼碼電報碼電報碼電報碼電報電報電報電報電報電報電報電報電報
</div>
</body>
</html>