Kurs z HTML dla początkujących

Kolor tła oraz tekstu za pomocą HTML i CSS

tutoriale

Kategoria wpisu Kurs CSS, Kurs HTML, Kursy, Tekst Tagi: , , , , on przez .



Reading Time: 2 minutes

Kolor tła jak i fontu można zmienić na rożne sposoby. Twórcy stron internetowych wykorzystują do tego celu głownie głównie CSS ze względu na jego rozbudowane możliwości. Zdecydowanie łatwiej jest edytować konkretną klasę lub właściwość niż przeszukiwać całą stronę w poszukiwaniu jakieś cechy dodanej w HTML. Dodatkowo bardzo istotna jest też spójność w obrębie całej strony internetowej.

Wpis ten będzie jednak nie tyle poświęcony CSS co bardziej pokazaniu wam jak zmienić kolor również z pomocą HTML.

Na początek warto sprawdzić jakie są podstawowe kolory na stronie. Wiedza ta z punktu widzenia HTML może okazać się przydatna.

Jak ustawić kolor dla całej strony w HTML

W przypadku HTML przypisywanie kolorów jak i innych właściwości odbywa się bezpośrednio w kodzie witryny.
Przykładowo:

Pierwsza zmienna bgcolor odnosi się do koloru tła. W miejsce „kolor-tła” wpisujemy interesujący nas kolor.

Druga zmienna text dotyczy tekstu na stronie. Analogicznie w miejsce „kolor-tekstu” wpisujemy wybrany kolor.

To, że wybraliśmy jakiś kolor dla tekstu na całej stronie nie oznacza, że wszędzie musi on być taki sam. Jeżeli umieścimy wybrany fragment w poniższym kodzie możemy zmienić jego barwę.

Zmiana koloru tekstu (fontu) na stronie

Gdzie za kolor wpisujemy nazwę koloru.
przykład:
Przykładowy tekst

Warto pamiętać że <body> może być tylko jedno na stronie i kiedy chcemy zmienić kolor tła nie tworzymy nowego.

Jak zmienić kolory w CSS

Kolor fontu z CSS

W CSS kolor czcionki elektronicznej uzyskujemy dzięki zmiennej color np:

Ogólnie strukturą jest zbliżona do tej w HTML. Różnica między stosowaniem jest jednak dość widoczna i istotna.

Kolor tła z CSS

Kolor tła z kolei opisuje zmienna background np.

Właściwości tej możemy użyć do zmiany koloru tła dowolnego elementu.

Teraz jako tło umieścimy obrazek

Nieco więcej dowiecie się z wpisu ustawianie grafiki jako tła strony

CSS daje nam również możliwość utworzenia tła w formie gradientu.

 

Dlaczego CSS a nie HTML

Odpowiedz jest prosta – możliwości. CSS nie ogranicza nas jedynie do podstawowych opisanych powyżej właściwości a HTML niestety tak. W czystym języku HTML jesteśmy bardzo ograniczeni do możliwości korzystania z zwykłych podstawowych kolorów. Podczas gdy w CSS oferuje nam zdecydowanie większy wachlarz możliwości np. tło możemy zrobić nawet w paski lub kratkę (kwestia dobrania odpowiedniego gradientu).

Podstawowe kolory na stronie

Umieszczanie grafiki jako tła strony

Gradient z wykorzystaniem CSS3 jako tło strony

Przeczytaj również

Wcięcia akapitowe CSS text-indent Z pomocą selektora text-indent możemy dokonać tzw. wcięcia w pierwszej linijce tekstu na stronie internetowej. Właściwość ta przyjmuje wartości liczb...
Odsyłacz pocztowy lub do telefonu HTML Jeśli chcesz na swojej stronie umieścić adres e-mail, po kliknięciu którego otworzy się program pocztowy to doskonałym rozwiązaniem dla będzie użycie ...
Zaokrąglenie narożników z pomocą CSS Zaokrąglanie rogów dowolnego obiektu HTML (guzika, fotografii, obrazka, div) z pomocą CSS3 jest bardzo proste. Do tego celu nie potrzebujemy żadnych d...
Zakładanie własnej strony internetowej Jeżeli chcemy założyć własną stronę internetową nie musimy wcale udawać się do specjalisty. Każda osoba korzystająca z  internetu może bowiem sam utwo...