liczby
- Data publikacji
- Ostatnio edytowano
Opis
W języku CSS do dyspozycji mamy dwa rodzaje liczb. Liczby całkowite oraz liczby dziesiętne. Zarówno liczby całkowite, jak i liczby dziesiętne mogą być liczbami dodatnimi lub liczbami ujemnymi.
Rodzaje liczb w języku CSS
- liczby całkowite
-
Liczby całkowite tworzymy za pomocą jednego lub kilku znaków z przedziału od
0
do9
. Znak1
oznacza liczbę jeden. Znak2
oznacza liczbę dwa. Znaki19
oznaczają liczbę dziewiętnaście itd. - liczby dziesiętne
-
Liczby dziesiętne tworzymy tak samo jak liczby całkowite z tą różnią, iż po dodatkowym znaku
.
(kropka) za pomocą jednego lub kilku znaków z przedziału od0
do9
możemy określić dodatkową wartość ułamka dla liczby całkowitej występującej przed wspomnianym znakiem kropki.Każdą liczbę całkowitą możemy zapisać w postaci liczby dziesiętnej, na przykład: "0.0", "1.0", "2.0", "19.0" itd.
Gdy liczba dziesiętna jest z przedziału "0.0 - 1.0", wtedy pierwszy znak "0" możemy pominąć. Innymi słowy zapis ".5" jest równoznaczny z zapisem "0.5", natomiast zapis ".09" jest równoznaczny z zapisem "0.09" itd.
- liczby dodatnie
-
Liczby dodatnie są tymi liczbami, które nie posiadają znaku
-
na początku swojego zapisu. Liczby dodatnie są większe od zera. Liczbami dodatnimi mogą być zarówno liczby całkowite, jak i liczby dziesiętne. Liczby dodatnie mogą posiadać znak+
na początku swojego zapisu (lecz nie muszą). Innymi słowy zapis+87
jest równoznaczny z zapisem87
.Liczba "0" nie jest liczbą dodatnią, lecz w języku CSS liczbę "0" możemy zapisać również w postaci "+0".
- liczby ujemne
-
Liczby ujemne muszą posiadać znak
-
na początku swojego zapisu. Liczby ujemne są mniejsze od zera. Liczbami ujemnymi mogą być zarówno liczby całkowite, jak i liczby dziesiętne.Liczba "0" nie jest liczbą ujemną, lecz w języku CSS liczbę "0" możemy zapisać również w postaci "-0".
Przykład
transform:scaleX(0.5);
Rozmiar szerokości przykładowego elementu "div" został przeskalowany (w tym wypadku zmniejszony o połowę), ponieważ do wspomnianego elementu "div" została dodana właściwość "transform" wraz z wartością w postaci funkcji "scaleX()", w której to funkcji została użyta wartość w postaci liczby dziesiętnej "0.5".
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 {
transform:scaleX(0.5);
margin:0 auto;
width:300px;
height:120px;
font-size:1.3em;
background-color:#7DCDE8;
}
</style>
</head>
<body>
<div>div</div>
</body>
</html>
Interpretacja
-
tak
-
tak
-
tak
-
tak
-
tak
-
tak