| CSS-TEKST | |
| FONT-FAMILY : (określa rozdzaj czcionki) |
Tahoma, Arial,Verdana, ‘Times New Roman’ , itd. (wielowyrazowe nazwy czcionek w cudzysłowie!) |
| Uwaga : Czcionkami, które najlepiej prezentują się na stronie, są Tahoma, Arial lub Verdana, która została stworzona specjalnie na potrzeby WWW (czytelna nawet dla 7pt). | |
| FONT-SIZE : (określa rozmiar czcionki) |
wartości bezwzględne : xx pt xx px xx % wartości względne : xx-small x-small small medium large x-large xx-large larger smaller |
| FONT-WEIGHT : (określa grubość czcionki) |
wartości względne: normal medium bold bolder lighter wartości bezwzględne liczbowe: 100-900 |
| FONT-VARIANT : (sposób wyświetlania) |
Normal small-caps |
| FONT-STYLE : (styl czcionki) |
Normal Italic Oblique |
| TEXT – ALIGN : (wyrównanie tekstu) |
Right Left Center Justify |
| TEXT – TRANSFORM : (rodzaj liter) |
None Capitalize Uppercase Lowercase |
| TEXT – DECORATION : (dekorowanie tekstu) |
Underline Overline Line-through Blink None |
| TEXT – INDENT : (wcięcie pierwszego wiersza tekstu) |
Wielkość określona w jednostkach lub procentach |
| LINE-HEIGHT : (odstęp między wierszami) |
Normal Wielkość określona w jednostkach lub procentach |
| VERTICAL-ALIGN : (wyrównanie tekstu w pionie) |
Baseline Sub Super Top Text-top Middle Bottom Text-bottom |
| LETTER-SPACING : (odstęp między literami) |
Normal Wielkość określona w jednostkach lub procentach. |
| COLOR : (określa kolor tekstu) |
Kod szesnastkowy (RGB) np.#FFFFFF Ogólnie przyjęte nazwy np. „red” |
| DIRECTION : (ustala kierunek tekstu) |
ltr rtl |
| WHITE-SPACE : (odstepy i załamania wiersza) |
Normal Pre Nowrap |
| CSS-MARGINESY | |
| MARGIN : (wszystkie marginesy) |
Wielkość określona w jednostkach lub procentach |
| MARGIN-TOP : (górny margines) |
Wielkość określona w jednostkach lub procentach |
| MARGIN-RIGHT : (prawy margines) |
Wielkość określona w jednostkach lub procentach |
| MARGIN-BOTTOM : (dolny margines) |
Wielkość określona w jednostkach lub procentach |
| MARGIN-LEFT : lewy margines) |
Wielkość określona w jednostkach lub procentach |
| CSS-OBRAMOWANIA | |
| BORDER-STYLE : (styl obramowania) |
None Solid Dotted Dashed Double Groove Ridge Inset Outset |
| BORDER-COLOR : (kolor obramowania) |
Kod szesnastkowy (RGB) np.#FFFFFF Ogólnie przyjęte nazwy np. „red” |
| BORDER-WIDTH : |
(grubość obramowania) Wielkość w px lub pt. Thin Medium Thick |
| BORDER-LEFT (LUB RIGHT, TOP, BOTTOM) : (okreslenie grubości konkretnego obramowania) |
To co w BORDER-WIDTH |
| BORDER-LEFT (LUB RIGHT, TOP, BOTTOM)-COLOR : |
To co w BORDER-COLOR |
| BORDER-LEFT (LUB RIGHT, TOP, BOTTOM)-STYLE : (okreslenie stylu konkretnego obramowania) |
To co w BORDER-STYLE |
| PADDING : (wypełnienie, czyli odstęp pomiędzy obramowaniem elementu, a jego zawartością) |
Auto Wielkość określona w px, pt lub procntach |
| PADDING-TOP : (odstęp górny) |
Auto Wielkość określona w px, pt lub procntach |
| PADDING-RIGHT : (odstęp prawy) |
Auto Wielkość określona w px, pt lub procntach |
| PADDING-BOTTOM : (odstęp dolny) |
Auto Wielkość określona w px, pt lub procntach |
| PADDING-LEFT : (odstęp lewy) |
Auto Wielkość określona w px, pt lub procntach |
| CSS-TŁO | |
| BACKGROUND-COLOR : (określa kolor tła) |
Kod szesnastkowy (RGB) np.#FFFFFF Ogólnie przyjęte nazwy np. „red” |
| BACKGROUND-IMAGE : (wstawia obrazk w tle) |
Url(jakiś_plik.jpg) w nawias wpisujemy adres obrazka |
| BACKGROUND-ATTACHMENT : (przytwierdzenie tła z obrazka) |
Scroll tło przewija się wraz z tekstem Fixed tekst będzie przewijał się nad tłem, ktore pełni tu role „znaku wodnego” |
| BACKGROUND-REPEAT : (ustala czy i w jaki sposób obrazek ma się powtarzać) |
Repeat pozwala na powtarzanie się obrazka jako tła (wartość domyślna) No-repeat obrazek nie będzie powtarzany Repeat-x obrazek powtarzany jest poziomo Repeat-y obrazek powtarzany jest pionowo |
| BACKGROUND-POSITION : (określa pozycję tła będącego obrazkiem) |
top left top center top right center left center center center right bottom left bottom left bottom center bottom right x(px, pt lub %) y(px, pt lub %) odstęp od lewego górnego rogu dokumentu: x ustawia w poziomie, y w pionie |
| CSS-LISTY | |
| LIST-STYLE-TYPE : (określa rodzaj wypunktowania) |
None Disc Circle Square Decimal Decimal-leading-zero Lower-roman Upper-roman Lower-alpha Upper-alpha Lower-greek Lower-latin Upper-latin Hebrew Armenian Georgian Cjk-ideographic Hiragana Katakana Hiragana-iroha Katakana-iroha |
| LIST-STYLE-IMAGE : (za wypunktowanie możemy wstawić własne obrazki) |
Url(jakiś_plik.jpg) w nawias wpisujemy adres obrazka |
| LIST-STYLE-POSITION : (wcinanie tekstu) |
Inside Outside |
| MARKER-OFFSET : (określa odległość między wypunktowaniem listy i tekstem w ramach listy) |
Auto Wielkość określona w px, pt. |
| CSS-POZYCJONOWANIE | |
| POSITION : właściwość tą wpisujemy na początku, aby określić sposób umiejscawiania elementu na stronie |
Absolute Relative Static |
| LEFT : (odleglość od lewej krawędzi) |
Auto Dowolna odległość (px, pt, %) |
| RIGHT : (odległość od prawej krawędzi) |
Auto Dowolna odległość (px, pt, %) |
| TOP : (odległość od górnej krawędzi) |
Auto Dowolna odległość (px, pt, %) |
| BOTTOM : (odległość od dolnej krawędzi) |
Auto Dowolna odległość (px, pt, %) |
| VISIBILITY : (określa czy element ma być widoczny na stronie) |
Visible Hidden Inherit |
| Z-INDEX : deklaruje kolejność warstw |
liczba całkowita |
| CLIP : (przycinanie) |
Auto Rect(a,b,c,d) wymiary |
| CSS-KURSOR | |
| CURSOR : |
Crosshair Hand E-resize ne-resize nw-resize n-resize se-resize sw-resize w-resize text wait help default |
| CSS-LINKI | |
| a:link (wygląd odsyłacza na stronie) |
{cecha : wartość; cecha:wartość} |
| a:visited (wygląd linku odwiedzonego) |
{cecha : wartość; cecha:wartość} |
| a:hover (link po najechaniu myszką) |
{cecha : wartość; cecha:wartość} |
| a:active (link aktywny) |
{cecha : wartość; cecha:wartość} |
| Uwaga : Należy przestrzegać tej kolejności ! Najpierw link, potem visited, hover i na końcu active. Poza tym selektor „a” nie może być oddzielony od pseudoklasy (a :link lub a: link ) – żle, (a:link ) – dobrze | |
| JEDNOSTKI MIARY | |
| MIARY ABSOLUTNE |
in - cal(2.54mm) cm mm pt -punkty drukarskie (1/72 cala) pc - pika (12pt) |
| MIARY RELATYWNE |
em - szerokość czcionki (małej literki m) ex - szerokość czcionki (małej literki x) |
| % |
procent |