Samouczek CSS

Strona główna CSS Wprowadzenie do CSS Składnia CSS Selektory CSS Instrukcje CSS Komentarze CSS Kolory CSS Tła CSS Granice CSS Marginesy CSS Dopełnienie CSS Wysokość/szerokość CSS Model skrzynki CSS Zarys CSS Tekst CSS Czcionki CSS Ikony CSS Linki CSS Listy CSS Tabele CSS Wyświetlanie CSS Maks. szerokość CSS Pozycja CSS CSS Z-indeks Przepełnienie CSS zmiennoprzecinkowy CSS Wbudowany blok CSS Wyrównanie CSS Kombinatory CSS CSS Pseudo-klasa Pseudoelement CSS Krycie CSS Pasek nawigacyjny CSS Listy rozwijane CSS Galeria obrazów CSS Sprite obrazu CSS Selektory atrybutów CSS Formularze CSS Liczniki CSS Układ strony internetowej CSS Jednostki CSS Specyfika CSS CSS !ważne Funkcje matematyczne CSS

Zaawansowane CSS

Zaokrąglone rogi CSS Obrazy obramowania CSS Tła CSS Kolory CSS Słowa kluczowe w kolorze CSS Gradienty CSS Cienie CSS Efekty tekstowe CSS Czcionki internetowe CSS Przekształcenia CSS 2D Przekształcenia CSS 3D Przejścia CSS Animacje CSS Etykietki CSS Obrazy w stylu CSS Odbicie obrazu CSS Dopasowanie obiektu CSS Pozycja obiektu CSS Maskowanie CSS Przyciski CSS Paginacja CSS Wiele kolumn CSS Interfejs użytkownika CSS Zmienne CSS Rozmiar pola CSS Zapytania o media CSS Przykłady CSS MQ Flexbox CSS

CSS Responsywne

Wprowadzenie do RWD Okienko RWD Widok siatki RWD Zapytania dotyczące mediów RWD Obrazy RWD Filmy RWD Ramy RWD Szablony RWD

Siatka CSS

Wprowadzenie do siatki Pojemnik na siatkę Element siatki

CSS SASS

Samouczek SASS

Przykłady CSS

Szablony CSS Przykłady CSS quiz css Ćwiczenia CSS Certyfikat CSS

Odniesienia CSS

Dokumentacja CSS Selektory CSS Funkcje CSS Dźwięk referencyjny CSS Bezpieczne czcionki internetowe CSS Animowalny CSS Jednostki CSS Konwerter CSS PX-EM Kolory CSS Wartości kolorów CSS Domyślne wartości CSS Obsługa przeglądarki CSS

Wprowadzenie do CSS


CSS to język, którego używamy do stylizacji strony internetowej.


Co to jest CSS?

  • CSS oznacza kaskadowe arkusze stylów
  • CSS opisuje, w jaki sposób elementy HTML mają być wyświetlane na ekranie, papierze lub w innych mediach
  • CSS oszczędza dużo pracy. Może kontrolować układ wielu stron internetowych jednocześnie
  • Zewnętrzne arkusze stylów są przechowywane w plikach CSS

Demo CSS - Jedna strona HTML - Wiele stylów!

Tutaj pokażemy jedną stronę HTML wyświetlaną z czterema różnymi arkuszami stylów. Kliknij poniższe łącza „Arkusz stylów 1”, „Arkusz stylów 2”, „Arkusz stylów 3”, „Arkusz stylów 4”, aby zobaczyć różne style:



Dlaczego warto korzystać z CSS?

CSS służy do definiowania stylów stron internetowych, w tym projektu, układu i odmian wyświetlania dla różnych urządzeń i rozmiarów ekranu.

Przykład CSS

body {
  background-color: lightblue;
}

h1 {
  color: white;
  text-align: center;
}

p {
  font-family: verdana;
  font-size: 20px;
}

CSS rozwiązał duży problem

HTML NIGDY nie miał zawierać znaczników do formatowania strony internetowej!

HTML został stworzony w celu opisania zawartości strony internetowej, na przykład:

<h1>To jest nagłówek</h1>

<p>To jest akapit.</p>

Kiedy tagi takie jak <font> i atrybuty kolorów zostały dodane do specyfikacji HTML 3.2, stało się to koszmarem dla twórców stron internetowych. Tworzenie dużych stron internetowych, w których do każdej strony dodawane były czcionki i informacje o kolorze, stało się procesem długotrwałym i kosztownym.

Aby rozwiązać ten problem, World Wide Web Consortium (W3C) stworzyło CSS.

CSS usunął formatowanie stylu ze strony HTML!

Jeśli nie wiesz, czym jest HTML, sugerujemy przeczytanie naszego samouczka HTML .


CSS oszczędza dużo pracy!

Definicje stylów są zwykle zapisywane w zewnętrznych plikach .css.

Dzięki zewnętrznemu plikowi arkusza stylów możesz zmienić wygląd całej witryny, zmieniając tylko jeden plik!