Wartość none
jest domyślną wartością właściwości text-transform
.
Domyślnie litery tekstu elementu HTML nie posiadają żadnego dodatkowego sposobu przekształcenia (ich wielkość jest taka sama jak w kodzie HTML).
text-transform:none;
LITERY TEKSTU tego elementu "DIV" nie posiadają ŻADNEGO dodatkowego SPOSOBU przekształcenia
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Darmowy Kurs CSS</title>
<style>
html {
font-size:16px;
font-family:Helvetica, sans-serif;
}
div {
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
LITERY TEKSTU tego elementu "DIV" nie posiadają ŻADNEGO dodatkowego SPOSOBU przekształcenia
</div>
</body>
</html>
Za pomocą wartości capitalize
właściwości text-transform
możemy sprawić, że pierwsze litery wszystkich wyrazów tekstu interesującego nas elementu HTML zostaną zamienione na duże litery.
text-transform:capitalize;
pierwsze litery wszystkich wyrazów tekstu tego elementu "div" zostały zamienione na duże litery, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "capitalize"
<!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-transform:capitalize;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
pierwsze litery wszystkich wyrazów tekstu tego elementu "div" zostały zamienione na duże litery, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "capitalize"
</div>
</body>
</html>
Za pomocą wartości uppercase
właściwości text-transform
możemy sprawić, że wszystkie litery tekstu interesującego nas elementu HTML zostaną zamienione na duże litery.
text-transform:uppercase;
wszystkie litery tekstu tego elementu "div" zostały zamienione na duże litery, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "uppercase"
<!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-transform:uppercase;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
wszystkie litery tekstu tego elementu "div" zostały zamienione na duże litery, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "uppercase"
</div>
</body>
</html>
Za pomocą wartości lowercase
właściwości text-transform
możemy sprawić, że wszystkie litery tekstu interesującego nas elementu HTML zostaną zamienione na małe litery.
text-transform:lowercase;
WSZYSTKIE LITERY TEKSTU TEGO ELEMENTU "div" zostały zamienione na MAŁE LITERY, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "lowercase"
<!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-transform:lowercase;
padding:1em;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>
WSZYSTKIE LITERY TEKSTU TEGO ELEMENTU "div" zostały zamienione na MAŁE LITERY, ponieważ do tego elementu "div" została dodana właściwość "text-transform" wraz z wartością "lowercase"
</div>
</body>
</html>