1. Składnia teoretyczna definiowania klasy.
  2. selektor.klasa {cecha: wartość}

  3. Podaj opis dla Klasa "cecha" oraz "wartość".
  4. Klasa to wartość atrybutu class="..." nadanego selektorowi z poziomu języka (X)HTML. "cecha" oraz "wartość" określają atrybuty element.

  5. Jaki znacznik może być selektorem ?
    Trzy przykłady selektrów dla klas.
  6. Selektorem może być potem dowolny znacznik:
    np.

  7. Podaj uwagi na temat nazwy klas:
  8. Nazwą może być dowolny pojedyńczy wyraz, nie może on zawierać:

    1. spacji
    2. kropki
    3. przecinka
    4. dwukropka
    5. pytajnika
    6. nawiasów
    7. znaku równości
    8. plusa itp.

    Może zawierać:
    1. litery od (A-Z, a-z)
    2. cyfry (0-9)
    3. myślniki ("-")
    4. podkreślniki ("_")

    Nazwa nie może zaczynać się od cyfry, ani myślnika.
    Gdy chcemy użyć znaków "zakazanych", należy w deklaracji klasy poprzedzić je odwróconym ukośnikiem "\",
    np. reguła: selektor. B\&W\? {cecha: wartość} odpowiada klasie: class = "B&W"
    .

  9. Jakie jest zastosowanie klas ?
  10. Deklaracja klasy jest przydatna szczególnie, jeśli na wielu stronach serwisu znajdują się elementy mające takie samo formatowanie, a
    dodatkowo nie można dla nich posłużyć się selektorem typu, ponieważ na stronie znajdują się inne znaczniki tego samego rodzaju
    co wybrany element, ale nie chcemy, aby i one otrzymały takie samo formatowanie.

  11. Kiedy ma zastosowanie lista klas ?
  12. Jeśli chcemy do pojedyńczego elementu przypisać kilka różnych klas.

  13. Składnia teoretyczna listy klas.
  14. <selektor class="klasa1 klasa2 klasa3...">...</selektor>

    Uwagi:

  15. Czym są podzbiory klas. Składnia teoretyczna listy klas.
  16. Istnieje możliwość określenia tzw. podzbioru klas, czy podania, jakie klasy musi mieć jednocześnie przypisane element, aby wybrana reguła CSS miała do niego zastosowanie. Na przykład po wpisaniu:

    selektor.klasa1.klasa3 {cecha:wartość}

    zmieniony zostanie sposób formatowania elementu:

    <selektor class="klasa1 klasa2 klasa3...">...</selektor>

  17. Co jest sygnałem (przesłanką), że należy zastosować klasy ?
  18. Jeśli jakiś element, o specyficznym rodzaju formatowania, występuje przynajmniej raz na niektórych stronach Twojego serwisu,
    jest to znak, że dobrze byłoby umieścić w zewnętrznym arkuszu stylów deklarację jego klasy. Dzięki temu, jeśli później zdecydujemy się
    zmienić jego formatowanie, nie będziemy musieli modyfikować każdej ze stron, a jedynie zewnętrzny arkusz.

  19. Kiedy i z jakiego powodu powinny być planowane klasy dla wykonywanej strony ?
  20. Już na początkowym etapie projektowania serwisu, dobrze jest dokładnie obmyślić, jakie klasy mogą okazać się użyteczne.
    Im więcej deklaracji klas - odnoszączych się do powtarzalnych elementów - umieścisz w zewnętrznym arkuszu stylów,
    tym szybciej przebiegnie późniejsza ewentualna modyfikacja stron.

  21. Jaki jest cel stosowania komentarzy podczas definiowania klas ?
  22. Dobrym pomysłem jest również wstawianie komentarza przed każdą deklaracją klasy w arkuszu (znaki: /*...*/), w którym opisuje się
    jej przeznaczenie. Po jakimś czasie w Twoim arkuszu może znaleźć się tyle klas, że zapomnisz, do jakich elementów się one odnosiły.
    Wtedy właśnie bardzo przydatny może się okazać wpisany wcześniej komentarz.

  23. Podaj konkretny przykład definiowania klasy oraz jej użycia (wywołanie).
  24. definicja arkusza styli
    p.przyklad_klasa {color: red}

    wywołanie
    <p class="przyklad_klasa">To jest akapit</p>

  25. Omów klasa donosząca się tylko do jednego selektora wraz z przykładem.
  26. Podobnie jak w przypadku identyfikatora, tak zdefiniowana klasa może ostać użyta tylko w tym selektorze, do którego została przypisana, np.:

    definicja arkusza styli

    p.moja {
     color: green;
     font-size: 14pt;
    }

    wywołanie
    Powinna zostać wywołana w znaczniku <p></p> w następujący sposób:
    <p class="moja">Treść akapitu</p>

  27. Jaki jest cel stosowania klasy uniwersalnej.
    Jakie jest znaczenie znaku "*" oraz kiedy można nie stosować tego znaku.
    Podaj przykład.
  28. W przypadku stosowania klas, często podczas ich definiowania, nie wiemy jeszcze, w stosunku do jakich znaczników będziemy chcieli ich
    poźniej użyć. Wtedy przydatny okazuje się selektor uniwersalny, który pozwala przypisać własności klasy do wszystkich elementów, którym
    zostania ona nadana, bez względu na typ znacznika, czyli użycie jest możliwe w różnych znacznikach.

    *.przyklad_uniwersalna {color: red}

    Każdy element, któremu nadamy klasę przyklad_uniwersalna, będzie miał kolor czerwony.
    W tym przypadku gwiazdkę (*) w regule stylu można pominąć:

    .przyklad_uniwersalna {font-size: 12pt, color: red}

    Zwróć uwagę na fakt występowania kropki po selektorze lub przed nazwą klasy. Jest to element obowiązkowy i bez tego dalsza praca nie miałaby sensu.

    Jak widać na powyższym przykładzie, klasa jest wywołana w dokumencie za pomocą atrybutu class, który może zostać umieszczony niemal w dowolnym znaczniku kodu HTML.

    definicja arkusza styli
    .moja {
    color: red;
    font-size: 12pt;
    font-style: italic;
    }

    wywołanie
    Wywołanie tak określanej klasy odbywa się za pomocą atrybutu class.

    <p class="moja">Przykład akapitu z określoną klasą</p>
    <h1 class="moja">Przykład nagłówka z określoną klasą</h1>