Co to jest CSS?

CSS zawiera reguły, które definiują wygląd elementów na stronie, takie jak kolory, fonty, marginesy i wiele innych. Reguły te są zastosowane do odpowiednich elementów na stronie za pomocą selektorów, takich jak tagi HTML lub klasy CSS. Dzięki CSS można tworzyć bardziej atrakcyjne i spójne strony internetowe.

Do czego służy CSS?

CSS pozwala na łatwe i szybkie zmiany wyglądu strony bez konieczności modyfikowania każdego elementu osobno. Jest to szczególnie przydatne, gdy trzeba zmienić wygląd wielu stron jednocześnie. CSS umożliwia także stosowanie różnych stylów do różnych urządzeń, takich jak komputery, tablety i telefony komórkowe, co zapewnia optymalne wrażenia użytkownika na każdym urządzeniu.

Jaka jest historia CSS?

Historia CSS sięga 1994 roku, kiedy Håkon Wium Lie, pracujący wtedy w firmie CERN, zaproponował stworzenie języka do opisywania wyglądu stron internetowych. Wium Lie uznał, że HTML, który wówczas był używany do tworzenia stron internetowych, był zbyt ograniczony i nie pozwalał na pełne opisanie wyglądu strony.

Po kilku latach rozwoju i konsultacji z innymi ekspertami, CSS zostało opublikowane jako oficjalny standard w 1996 roku przez W3C (World Wide Web Consortium). Pierwsze przeglądarki, które w pełni wspierały CSS, pojawiły się w latach 1997-1998 i od tego czasu język ten stał się nieodłącznym elementem tworzenia stron internetowych.

Od tamtej pory CSS przeszło wiele zmian i ulepszeń, a wersje CSS2 i CSS3 zostały opublikowane w latach 1998 i 1999 oraz 2011-2012, odpowiednio. Dzięki rosnącemu zapotrzebowaniu na bardziej skomplikowane i wyrafinowane strony internetowe, CSS nieustannie się rozwija i jest niezbędnym narzędziem dla web developerów i projektantów stron internetowych.

Jak dodać CSS do HTML?

Istnieją trzy główne sposoby na dodanie CSS do strony internetowej:

Umieszczenie kodu CSS bezpośrednio w sekcji <head> strony HTML. Można to zrobić poprzez dodanie następującego kodu HTML:

<head>
  <style type="text/css">
    /* tutaj wpisujemy reguły CSS */
  </style>
</head>

Umieszczenie kodu CSS w osobnym pliku i połączenie go z plikiem HTML za pomocą tagu link. Kod HTML powinien wyglądać następująco:

<head>
  <link rel="stylesheet" type="text/css" href="nazwa_pliku.css" />
</head>

Inline styling - użycie atrybutu style bezpośrednio w elemencie HTML. Na przykład:

<p style="color: blue;">To jest akapit z inline stylingiem.</p>

Wybór sposobu zależy od potrzeb i preferencji programisty. Najczęściej stosowane jest połączenie z osobnym plikiem CSS, ponieważ pozwala ono na łatwe i szybkie zmiany wyglądu strony bez konieczności modyfikowania każdego pliku HTML osobno. Więcej przeczytasz we wpisie o dodawaniu CSS do HTML.