KURS CSS

KURS HTML KURS CSS


Treść

CSS(Cascading Style Sheets) to język wprowadzony 1996 przez organizację W3C, do zarządzania wyglądem strony. Powinien on formatować wszystkie elementy występujące na stronie WWW pod względem wizualnym.
Wyróżniamy trzy typy arkuszy CSS: wpisane, osadzonei zewnętrzne. Te nazwy w niektórych publikacjach mogą być nieco inne np: styl lokalny, w linii - wpisany, wewnętrzny - osadzony.

Osadzanie stylów CSS w dukumencie HTML

W zależności od miejsca usadowienia stylu CSS mamy różne deklaracje stylu.
Styl wpisany (lokalny, w linii) umieszczamy wewnątrz znacznika HTML. np:<p style="cechawartość">
Styl opisany (wewnętrzny) wpisujemy do sekcji HEAD w formacie:

<style type="text/css">
< !--
selektor{
	cecha:wartość;
}
-->
</style>

Styl zewnętrzny podłączony deklaracją umieszczoną w sekcji HEAD:
<link rel="Stylesheet" type="text/css" href="nazwa.css">

Składnia CSS

Za zmianę wyglądu elementów witryny odpowiadają reguły stylów. Każda z reguł związana jest z konkretnym znacznikiem HTML. Reguła stylu składa się z 2 elementów:
a) Selektora
b) Deklaracji
Selektor to nazwa znacznika np.:div. Deklaracja to zbiór cech i ich wartości. Cechą jest np.: szerokość (width) a wartością np.: 500px

Grupowanie selektorów

CSS dopuszcza łącznie w jednej regule selektorów które mają mieć takie same właściwości. Stosuje się to np.: do nagłówków, elementów tabeli czt listy.

  1. Lista uporządkowana

Hierarchia obsługi stylów

Przeglądarki czytają kod stron od góry na dół i od lewej do prawej. Style umieszczone wyżej mają niższy priorytet niż style umieszczone niżej (dotyczy głownie styli "w linii"). Inna hierarchia to hierarchia "miejsca osadzenia":
Najważniejsze są style wpisane, potem osadzone, zewnętrznei ustawienia przeglądarki.
Style o niższym priorytecie formatują stronę wtedy gdy styl o wyższym priorytecie nie formatuje danego elementu strony.
Zasady kaskadowości można zmienić poleceniem !important umieszczonym w stylu po wartości której dotyczy.

Przykład zastosowania polecenia !important
<div style="color:red !important">
<p style="color:green">Zastosowanie polecenia 
<b style="color:blue">!important</b> </p>
</div>

Zastosowanie polecenia !important. Niestety tutaj nie zadziałał.

Dziedziczenie

W HTML często jedne elementy są umieszczane wewnątrz innych. Jeżeli dla elementu nadrzędnego zostanie zdefiniowana jakaś właściwość to z reguły jest ona przypisana elementom podrzędnym. Ten mechanizm nazywamy dziedziczeniem.

Przykład
<div style="color:red !important">
<p>Przykład dziedziczenia koloru <b>deklarowanego w div'ie
</b> </p>
</div>

Przykład dziedziczenia koloru deklarowanego w div'ie

Walidacja

Walidacja to przeprowadzana przez reklamodawcę weryfikacja poprawności wygenerowanych akcji, tj. weryfikacja zebranych leadów lub dokonanych transakcji sprzedaży. Walidacja jest niezbędnym elementem w kampaniach efektywnościowych, w których reklamodawca – zgodnie z nazwą – rozlicza się wyłącznie za określony wcześniej efekt, tj. za akcje, które spełniają założone kryteria.

Mateusz O. Gr. 1