CSS – do czego służy

Co oznacza CSS?

CSS to angielski akronim oznaczający “Cascading Style Sheet” (kaskadowe arkusze stylów).

Co to jest arkusz stylów CSS?

CSS jest sposobem na oddzielenie strukturalnych elementów witryny od jej prezentacji. Korzystanie z CSS pozwala na zmianę architektury dokumentów i ograniczenie ich rozmiarów do niezbędnego minimum mając jednocześnie kontrolę nad wyglądem witryny.

Użytkownik może zmienieć rozmiar i kolor czcionki oraz inne elementy wyglądu z jednego pliku CSS. Wygląd witryny która nie została zaprojektowane w CSS może się różnić między przeglądarkami. CSS ułatwia normalizację witryny i zbliżenie jej wyglądu do zamierzonego.

Dlaczego warto używać CSS?

Najlepiej byłoby, gdyby wszystkie strony były projektowane w arkuszach stylów, bez względu na wielkość witryny. Rozważmy przykład kiedy stworzyliśmy witrynę składająca się z 30 stron napisanych w kolorze niebieskim. Trzy miesiące później klient decyduje się na zmianę czcionki na pomarańczowy. Jeśli witryna nie została zaprojektowana w CSS, zmiana koloru może być bardzo pracochłonna, ponieważ należy przerabiać jedną stronę za drugą. Jednakże, jeżeli witryna została zaprojektowana w CSS, wystarczy określić, że chcemy kolor pomarańczowo, i voila, wszystkie strony w jednej operacji zmieniaja kolor czcionki.

Piękno tej techniki polega na tym, że tylko jeden arkusz zarządza wszystkimi stronami witryny. Kolejną zaletą jest to, że CSS zapewnia jednorodność w wyglądzie strony.

Wbrew temu, co można by pomyśleć, to co widzi użytkownik nie zawsze jest tym, co programista chciał pokazać. Arkusze tworzą efekt kaskadowy, tzn. komunikują się z przeglądarką w celu stworzenia jednolitego formatu dla użytkownika.

Kiedy należy używać arkuszy stylów?

Jako projektant, oznacza to, że informacje związane z konkretnym miejscu powinny być w formacie HTML, ale nie powinny one zawierać informacje na temat witryny będą wyświetlane. Youve prawdopodobnie już domyślasz, jest to rola z kaskadowych arkuszy stylów.

Z CSS, można ustalić, na przykład, w jaki sposób chcesz tytuły wyświetlane. Trzeba zatem, aby wprowadzić informacje tylko raz. Każdy tytuł tej witryny jest związane z stylesheet się przyjąć tę wygląd. Chcesz odróżnienia trochę więcej dowodów na poziomie 3 Poziom 2? Wystarczy edycji CSS i wszystkich tytułów pytanie wyświetlić żądany wygląd! Wyobraź sobie, ilość pracy, aby zapisać (i unikać błędów masz).

Innym korzyści leży w zarządzaniu dużych i wyrafinowanych witryn. Z tej techniki, pełne organizacje mogą dzielić się małej liczby arkuszy stylów, a także zapewnić jednorodność całej witryny bez konieczności stałego aktualizowania lub edytować do wprowadzania zmian

Span

Właściwość <span>

<span> jest podobną koncepcja do elementu <div> z tą różnicą, że określa on styl liniowo,na przykład, jedynie dla jednej litery lub całego paragrafu. Przykład w kodzie HTML:

<span class=”italic”>This text is italic</span>

Styl “italic jest okreslony w arkuszu CSS w następujący sposób:

.italic{

font-style: italic;

}