mozilla
Wyniki wyszukiwania

    Po co używać CSS

    Ta strona tłumaczy, do czego dokumenty wykorzystują CSS. Używając CSS dodasz do swojego dokumentu arkusz stylów.

    Informacja: Po co używać CSS?

    CSS pomaga utrzymać treść dokumentu oddzieloną od informacji o tym, jak należy ją wyświetlać. Szczegóły opisujące, jak należy wyświetlać dokument, są znane jako styl. Utrzymywanie rozdzielenia treści od wyglądu:

    • pozwala uniknąć powtórzeń,
    • ułatwia zarządzanie dokumentem,
    • umożliwia wykorzystywanie różnych stylów do różnych celów w jednym dokumencie.
    Przykład
    Twoja strona WWW może mieć wiele dokumentów wyglądających podobnie. Korzystając z CSS, przechowujesz informacje o wyglądzie w osobnych plikach używanych we wszystkich dokumentach.

    Kiedy użytkownik ogląda stronę WWW, przeglądarka pobiera informacje o stylach równolegle z treścią strony.

    Kiedy użytkownik drukuje stronę, można mu dostarczyć inne informacje o stylu, które sprawią, że wydrukowany dokument będzie bardziej czytelny.

    Ogólnie rzecz biorąc, dzięki CSS język znaczników jest wykorzystywany wyłącznie do opisu treści dokumentu, a nie jego stylu. CSS jest zaś używany do opisu stylu, nie treści. (Dalej w tym kursie będzie można zobaczyć pewne wyjątki od tej reguły.)

    Więcej szczegółów
    Język znaczników, taki jak HTML, również dostarcza pewnych mechanizmów opisu stylów. Na przykład w HTML-u można użyć znacznika <B>, aby pogrubić tekst albo określić kolor tła strony w znaczniku <BODY>.

    Kiedy używasz CSS, zazwyczaj unikasz stosowania tych funkcji języka znaczników, aby trzymać wszystkie informacje o stylu dokumentu w jednym miejscu.

    Zadanie: Tworzenia arkusza stylów

    Stwórz inny plik tekstowy w tym samym katalogu, co poprzednio. Ten plik będzie arkuszem stylów. Nazwij go: style1.css

    Skopiuj poniższą linię i wklej ją do pliku CSS, a następnie zapisz ten plik:

    strong {color: red;}

    Wiązanie arkusza stylów do dokumentu

    Aby powiązać swój dokument z arkuszem stylów, wyedytuj plik HTML. Dodaj pogrubioną linię:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
    <HTML>
      <HEAD>
      <TITLE>Sample document</TITLE>
      <LINK rel="stylesheet" type="text/css" href="style1.css">
      </HEAD>
      <BODY>
        <P>
          <STRONG>C</STRONG>ascading
          <STRONG>S</STRONG>tyle
          <STRONG>S</STRONG>heets
        </P>
      </BODY>
    </HTML>
    

    Zapisz ten plik i odśwież widok w swojej przeglądarce. Ten arkusz stylów sprawia, że pierwsze litery są czerwone:

    Cascading Style Sheets
    Wyzwanie
    Poza czerwonym, CSS pozwala używać innych nazw kolorów.

    Bez patrzenia w dokumentację znajdź pięć innych nazw kolorów, które działają w Twoim arkuszu stylów.

    Co dalej?

    Jeżeli masz problemy ze zrozumieniem tej strony albo chcesz ją skomentować, pomóż nam, dopisując się na stronie Dyskusji.

    Teraz masz już przykładowy dokument powiązany z osobnym arkuszem stylów, jesteś zatem gotów do zrozumienia, jak przeglądarka wiąże je podczas wyświetlania dokumentu: Jak działa CSS

    Autorzy i etykiety dokumentu

    Etykiety: 
    Contributors to this page: Anonymous, Takenbot, Taken, Marcoos, Ruby, teoli, Verruckt, Witia, gandalf, Mgjbot, Ptak82, Dria
    Ostatnia aktualizacja: teoli,