Jak zmieniać kody Kolorów w języku HTML.doc

Jak zmieniać kody Kolorów w języku HTML.

Wstęp Jak zmieniać kody Kolorów w języku HTML

Definicje kolorów przydają się np. do ustawiania koloru tekstu lub tła elementów na stronie lub tła tekstu. W miejsce wyrazu "kolor" należy wpisać o jaką barwę nam chodzi. Można to zrobić na dwa sposoby: podać słowną nazwę jednego z szesnastu kolorów podstawowych [Tak zwanych, kolorów predefiniowanych (czyli ustalonych arbitralnie w języku HTML) - jest tych kolorów 16.] lub wstawić w to miejsce odpowiednik dowolnego koloru w kodzie szesnastkowym (HEX), lub kodowaniu dziesiętnym rgb(RGB).

A teraz mała powtórka z fizyki (Nikuś, proszę, nie uciekaj jeszcze od komputera, to będzie baaardzo krótka powtórka).
Każdą barwę można utworzyć mieszając w odpowiednich proporcjach trzy kolory podstawowe: czerwony, zielony i niebieski (RGB - od angielskich słów: Red - czerwony, Green - zielony, Blue - niebieski).

Nasycenie każdego z kolorów zapisujemy w definicji barwy w postaci: #RRGGBB,
gdzie:

RR - nasycenie koloru czerwonego;
GG - nasycenie koloru zielonego;
BB - nasycenie koloru niebieskiego
[użyty w kodzie koloru znak # (hash) oznacza, że definiujemy kolor w kodzie HEX - szesnastkowym).

Wszystkie składowe muszą być podane w systemie szesnastkowym i poprzedzone znakiem #. Zasada jest taka Im większa liczba (HEX), tym jaśniejszy kolor.
Ważne: zauważ, że liczba musi się składać z sześciu cyfr, nawet jeśli są to same zera!

Uwaga:
(w systemie dziesiętnym jest dziesięć cyfr: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9,):

w systemie szesnastkowym (hex) jest szesnaście podstawowych cyfr:
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F.

Przykładowo: liczba B5 zapisana w kodzie HEX, oznacza w systemie dziesiętnym 181
bo B to:- [=11], a 5 to: [=5] to daje w zapisie pozycyjnym
11 x 161 + 5 x 160 = 11 x 176 + 5 x 1 = 181.
W systemie (Hex) obowiązuje tak jak i w systemie dziesiętnym pozycyjny system zapisu licz.

W systemie dziesiętnym:

Liczba 181 - to jej wartość oznacza (1 x 102 + 8 x 101 + 1 x 100) czyli
1 x 100 + 8 x 10 + 1 x 1 = 181

ten sam zapis w systemie (hex):
Będzie miał kod B5 – wartość tego zapisu oznacza:

B czyli w dziesiętnym to 11,
a  5 to w dziesiętnym też 5.

Czyli mamy:
B5(Hex) w zapisie pozycyjnym to:
(11 x 161 + 5 x 160) = 176 + 5 = 181

To nie jest trudne, ale aby takiej Konwersji DEC -> HEX (lub odwrotnie) można tego w prosty sposób dokonać np. w windowsowym Kalkulatorze (trzeba tylko włączyć w nim widok Profesjonalny lub Programisty).

Całkowita ilość kolorów możliwych do uzyskania tą metodą wynosi: 16 777 216.

Oto przykład:
kod koloru: zapisany w (HEX): #9933CC to będzie taki kolor                       

Aby otrzymać inne barwy, wystarczy zmienić niektóre cyfry w zapisie (HEX). Najlepsze rezultaty (będą widoczne różnice) można otrzymać, zmieniając pierwszą; trzecią lub piątą cyfrę (w kolejności od lewej strony), można zmieniać pojedynczo lub zmieniając wszystkie jednocześnie. Otrzymamy wtedy 4 różne kolory. Dotyczy to zarówno koloru tekstu jak i koloru tła tekstu, kodowanie jest dokładnie takie samo.

Oto warianty koloru tekstu dla powyższego przykładu:

Jeśli przyjmiemy jako nasz kolor wyjściowy kolor: #9933CC                  : to

(HEX): #A933CC                        to zmiana na pozycji (1)

(HEX): #99A3CC                                      to zmiana na pozycji (3)

(HEX): #9933AC                       to zmiana na pozycji (4)

(HEX): #A9A3AC                   to zmiana na pozycjach (1; 3; i 4)

Uwaga:
Jeśli tekst będzie miał taki sam kolor jak i jego tło tekst zniknie (nie będzie widoczny).

Dla kodowania koloru tekstu jako (Hex) szablon jest taki:

Selektor: (style = ”atrb.1; arb.2; arb.3; ….; arb.n;”)> Tu Tekst do wyświetlenia (To co chcemy napisać)</selecor>

Za napis selektor można podstawić znaczniki:

<p>….</p>, - to znacznik akapitu testu

<a>…. </a>, - to znacznik tzw. Kotwicy, czyli umocowania tekstu na stronie (wyznacza przywiązanie tekstu do pozycji na stronie)

<b>.…</b>, - to znacznik pogrubienia tekstu nie zależnie od grubości wybranej czcionki.

<i>….</i>,- to znacznik pochylenia tekstu nie zależnie od rodzaju wybranej czcionki.

<u>….</u>,- to znacznik podkreślenia tekstu nie zależnie od rodzaju wybranej czcionki.

<div>….</div> - to znacznik grupujący jakieś elementy strony, czy kartki papieru lub obrazków jako wspólny blok (testu, obrazków innych elementów)

Przykład użycia znacznika akapitu:

Akapit (inaczej paragraf) jest bardzo ważny w składni HTML, ponieważ pozwala w określony sposób sformatować tekst na ekranie (ułożyć go w podany sposób). Robi się to podając atrybuty znacznika.
Atrybut wpisuje się zawsze wewnątrz znacznika otwierającego - bezpośrednio po jego nazwie (oddzielony od niej spacją), a przed znakiem zamknięcia nawiasu ostrego, czyli przed ">". Każdy znacznik ma ściśle określone atrybuty, które obsługuje. W przypadku akapitu można zastosować m.in. następujące:

1.      Wyrównanie tekstu do lewej strony (domyślnie)

<p style="text-align: left">Treść akapitu</p>

Na ekranie wygląda to tak:

Treść akapitu

====================================================

2.      Wyrównanie tekstu do prawej

<p style="text-align: right">Treść akapitu</p>

Na ekranie wygląda to tak:

Treść akapitu

==========================================================================

3.      Wyśrodkowanie tekstu

<p style="text-align: center">Treść akapitu</p>

Na ekranie wygląda to tak:

Treść akapitu

==========================================================================

4.      Justowanie tekstu (wyrównanie do obu marginesów jednocześnie)

<p style="text-align: justify">Treść akapitu Treść akapitu Treść akapitu</p>

Na ekranie wygląda to tak:

Treść akapitu              Treść akapitu              Treść akapitu

We wszystkich przypadkach wyróżnione zostały właśnie ...