ßê çàäàòè êîë³ð ôîíó
ßê ïðàâèëî, áàçîâèé êîë³ð ôîíó âåá-ñòîð³íêè çàäàºòüñÿ ç âèêîðèñòàííÿì ìîâè îïèñó ñòèë³â CSS (Cascading Style Sheets - «êàñêàäí³ òàáëèö³ ñòèë³â»). гäøå äëÿ öüîãî âèêîðèñòîâóþòüñÿ ìîæëèâîñò³ ìîâè HTML (HyperText Markup Language - «ìîâà ðîçì³òêè ã³ïåðòåêñòó»). ²íîä³ åëåìåíòè îïèñó CSS ïîì³ùàþòüñÿ âñåðåäèíó HTML-òåã³â.
1
Âèêîðèñòîâóéòå àòðèáóò bgcolor òåãà body, ÿêùî õî÷åòå ìàêñèìàëüíî ñïðîñòèòè ïðîöåäóðó âêàç³âêè ôîíîâîãî êîë³ðà é çâåñòè äî ì³í³ìóìó çì³íè â âèõ³äíîìó êîä³. Îïèñ âñ³õ åëåìåíò³â ñòîð³íêè ïîì³ùàºòüñÿ â èñõîäíèêå ñòîð³íêè âñåðåäèíó áëîêó HTML-êîäó, ÿêèé ïî÷èíàºòüñÿ ç òåãà ³ çàâåðøóºòüñÿ òåãîì . Àòðèáóò bgcolor âêàçóºòüñÿ â â³äêðèâàþ÷îìó òåç³ ³ ì³ñòèòü ³ìåíîâàíå çíà÷åííÿ êîë³ðîâîãî â³äò³íêó (íàïðèêëàä, Red àáî Chocolate) àáî â³äïîâ³äíèé éîìó ø³ñòíàäöÿòêîâèé êîä êîë³ðà (# FF0000 àáî # D2691E, â³äïîâ³äíî). Ó íàéïðîñò³øîìó âàð³àíò³ òàêèé òåã ìîæå áóòè çàïèñàíèé, íàïðèêëàä, òàê:Àáî òàê:Îáèäâà âàð³àíòè çàäàþòü îäíàêîâèé ÷åðâîíèé êîë³ð äëÿ ôîíó äîêóìåíòà.
2
Âèêîðèñòîâóéòå âëàñòèâ³ñòü background-color, ÿêùî õî÷åòå çàäàòè êîë³ð ôîíó äîêóìåíòà çà äîïîìîãîþ ìîâè îïèñó ñòèë³â - öåé ìåòîä çàñòîñîâóºòüñÿ íàáàãàòî ÷àñò³øå. Áëîêè îïèñó ñòèë³â ìîæóòü áóòè àáî âêëþ÷åí³ äî ïî÷àòêîâîãî êîäó äîêóìåíòà, àáî çàïèñàí³ â îêðåìèé ôàéë ç ðîçøèðåííÿì css. Ïîñèëàííÿ íà çîâí³øí³é ôàéë ïîì³ùàºòüñÿ â çàãîëîâíó ÷àñòèíó ñòîð³íêè (ì³æ òåãàìè ³ ) ² âèãëÿäຠïðèáëèçíî òàê: ßêùî æ CSS-³íñòðóêö³¿ íåìຠíåîáõ³äíîñò³ âèíîñèòè â äîäàòêîâèé ôàéë, òî @import "style.css"- Òðåáà çàì³íèòè, íàïðèêëàä, òàêèì òåñòîì: body {background-color: Red-} Òóò body âêàçóº, ùî ³íñòðóêö³ÿ âñåðåäèí³ ô³ãóðíèõ äóæîê, ùî âèçíà÷ຠ÷åðâîíèé êîë³ð ôîíó, â³äíîñèòüñÿ äî òîãî ñàìîãî òåãó body ìîâè HTML. ² òóò ³ñíóº ê³ëüêà ñèñòåì âèçíà÷åííÿ â³äò³íê³â êîë³ðà, àëå íàé÷àñò³øå âèêîðèñòîâóþòüñÿ ø³ñòíàäöÿòêîâ³ êîäè: body {background-color: # FF0000-}
3
Çàì³í³òü âëàñòèâ³ñòü background-color íà background äëÿ êîìïàêòíîãî îïèñó ñêëàäí³øîþ ôîíîâî¿ ñòðóêòóðè. Íàïðèêëàä, ÿêùî êð³ì ôîíó ïåâíîãî êîë³ðà, â ï³äêëàäêó äîêóìåíòà òðåáà ïîì³ñòèòè ÿêèé-íåáóäü ìàëþíîê. Òàêèé îïèñ ìîæå âèãëÿäàòè, íàïðèêëàä, òàê: body {background: Red url (img / BGimage.jpg) no-repeat-}
4
ϳäãîòóéòå íà îñíîâ³ îáðàíîãî âàìè âàð³àíòó êîä, ùî çàäຠêîë³ð ôîíó äîêóìåíòà, ³ âñòàâòå éîãî â èñõîäíèê ñòîð³íêè. Çðîáèòè öå ìîæíà, íàïðèêëàä, çà äîïîìîãîþ îíëàéí-ðåäàêòîðà ñòîð³íîê ñèñòåìè óïðàâë³ííÿ ñàéòîì àáî â áóäü-ÿêîìó òåêñòîâîìó ðåäàêòîð³.
Êîðèñíà ïîðàäà
Âèçíà÷èòè ø³ñòíàäöÿòêîâèé êîä êîë³ðíîãî â³äò³íêó ìîæíà çà äîïîìîãîþ ðåçèäåíòíèõ ïðîãðàì (íàïðèêëàä - ColorImpact, Ruler), àáî çà äîïîìîãîþ îí-ëàéí êàëüêóëÿòîð³â.
Ñòàòò³ çà òåìîþ "ßê çàäàòè êîë³ð ôîíó"
Îö³í³òü, áóäü ëàñêà ñòàòòþ