Kurs z HTML dla początkujących

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

tutoriale

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



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 ponieważ jest to proste i dużo łatwiejsze w kontrolowaniu oraz dalszemu rozwijaniu. Zdecydowanie łatwiej jest edytować konkretną klasę lub właściwość niż przeszukiwać całą stronę w poszukiwaniu jakieś cechy dodanej w HTML. 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. Dodatkowo w czystym HTML jesteśmy bardzo ograniczeni w możliwości korzystania z kolorów podczas gdy w CSS 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ż

Figury geometryczne z użyciem CSS Pojawienie się CSS3 dało bardzo duże możliwości twórcą stron internetowych (ale nie tylko) a w połączenia z HTML5 zmieniło kodowanie stron w prawdziwe...
Przekreślenie Tekstu HTML/CSS W HTML istnieje kilka metod służących do przekreślania tekstu  i . Między oboma sposobami przekreślenia istnieją pewne różnice ...
Odstępy między komórkami w Tabeli kurs HTML Czasami w celu poprawy wyglądu tabeli chcemy oddzielić od siebie poszczególne komórki. Do tego celu wykorzystać możemy: Gdzie zmienna cellspacing ...
Zmiana wielkości liter z pomocą CSS – text-t... Właściwość text-transform (z języka ang. transformacja tekstu) jest jedną z popularniejszych metod modyfikacji tekstu. Zadaniem własności jest zmiana ...