Podstawy CSS

LICZBA DNI: 3 (24h)

KOD KURSU: CSS/F

Powiadom
o kolejnych terminach

# css

# style

# rwd

Autor szkolenia:
Krzysztof Ścira

O szkoleniu

DLA KOGO?

Szkolenie jest adresowane do osób uczących się tworzenia stron internetowych, posiadających podstawową znajomość języka HTML

WYMAGANIA

znajomość podstaw HTML lub wybranego systemu CMS z edytorem wizualnym

ZALETY

Szkolenie umożliwia poznanie CSSa nawet osobom z bardzo niewielką wiedzą początkową

Cele szkolenia

Poznanie kaskadowych arkuszy stylów CSS w stopniu pozwalającym na swobodne tworzenie prostych struktur stron internetowych i nadawanie im atrakcyjnego wyglądu

Program

  • Możliwości CSSa
  • Selektory
  • Sposoby i miejsca definiowania reguł
  • Style inline, osadzanie stylów w dokumencie
  • Style wbudowane przeglądarek
  • Resety i normalizacje
  • Elementy liniowe, blokowe i inne
  • Sposoby podawania kolorów
  • px, pt, cm
  • em, rem
  • vh, hh
  • %
  • Funkcja calc
  • Paragrafy
  • Spany
  • Stylowanie znaczników: br, hr, pre
  • Style domyślne
  • Listy wypunktowane, numerowane i definicji
  • Zagnieżdżanie list
  • Sposoby numeracji
  • Dekoracja linków
  • Tworzenie tabel zgodnie z ich przeznaczeniem
  • Stylowanie nagłówków tabel
  • Stylowanie obramowań
  • Padding
  • Margin
  • Border
  • Outline
  • Border
  • Box-shadow
  • Tworzenie efektu wypukłości
  • Cienie wewnętrzne i zewnętrzne
  • Nakładanie cieni i cienie wielokrotne
  • Efekty na tekście
  • Podnoszenie usability
  • Text-outline
  • Linki (A)
  • Zagnieżdżanie w sobie wielu A
  • Text-decoratnion, a border bottom
  • Stylowanie underline
  • Przyciski (Button)
  • Elementy formularzy
  • Input, select, textarea
  • Stylowanie shadow-dom
  • Overflow
  • Przewijanie elementów wewnętrznych na urządzeniach mobilnych
  • Paski przewijania
  • Marginesy i paddingi
  • Absolute i relative
  • Fixed
  • Flexbox
  • Sticky
  • "DIVy i floaty"
  • Wirtualne tabelki
  • Absolute*
  • Flexbox
  • Metody środkowania elementów
  • Tła obrazkowe
  • Obrazki pod wyświetlacze o podwyższonej rozdzielczości
  • Ikony zamiast plików graficznych (font-awesome i fontastic)
  • Transition
  • Keyframes i animate
  • Czasy przejścia
  • Funkcje czasu
  • Opóźnienia
  • Transform (scale, translate, rotate, skew)
  • Transform3D
  • Transform-origin
  • Wygładzanie tekstu przy transformacjach – text-smooth
  • Wygładzanie elementów podczas transformacji w CSS
  • Liniowe
  • Radialne
  • Wielokrotne
  • Tworzenie typowych layoutów responsywnych
  • “Mobile first”, a rzeczywistość
  • Reguły przyrostowe
  • Procentowe definicje
  • Frameworki typograficzne
  • Pełne frameworki
  • Biblioteki do konkretnych zadań
  • Ellipsis
  • Clearfix
  • FastGrid
  • VisuallyHidden
  • Pionter-events: none
  • Resety CSS
  • Menu tworzone jako listy
  • Użycie natywnej walidacji formularzy*
  • Divitis i classyfis
  • Layouty oparte o tabelki
  • Odczytywanie i nadawanie parametrów
  • Animacje JS a animacje CSS
  • Performance (dodatek do przeglądarki)
  • Sprawdzanie poprawności składni
  • IDE
  • DevToolsy w przeglądarce (zmiany live layoutu)
  • Build tools
  • Live reload
  • Css injection
  • Live coding

POLITYKA COOKIES:

Korzystamy z plików cookies, by móc jak najlepiej dostosować stronę do Twoich potrzeb oraz wyświetlać Ci przydatne i adekwatnych dla Ciebie reklamy w serwisie i poza nim. Możesz kontrolować ustawienia ciasteczek w swoich ustawieniach swojej przeglądarki. Odwiedzając tę stronę, wyrażasz zgodę na wykorzystywanie przez nas plików cookies.