2. 1. Обща информация:
• цветовете на фона на страницата и на текста могат
да се задават чрез изписване на английското
название на съответния цвят, например:
<font color="blue">Това е син текст</font>
<body bgcolor="yellow"> (Задава жълт цвят на фона)
• Не всички оттенъци могат да се изобразят чрез
изписване на съответното английско название.
• Не е препоръчително изобщо да използвате
езиковите названия на цветовете, за да зададете
цвят.
3. 2. Кодиране на цветовете:
• Браузърите показват всички цветове чрез
комбиниране на различните стойности на само 3
цвята: червен (Red), зелен (Green) и син (Blue).
Това е т.нар. RGB стандарт. Всеки един от тези 3
основни цвята може да приема стойности от 0
до 255. Всички останали цветове представляват
някаква комбинация от тези стойности.
Например кода за бял цвят е R:255, G:255, B:255,
а кода за черен цвят е R:0, G:0, B:0, т.е. нулата
"създава" най-тъмната част на спектъра, а 255 най-светлата.
• HTML не възприема десетичните стойности на
цветовете, затова те се превръщат в 16-сетични
стойности.
• Така например 255 се изобразява в 16сетичен код като FF, а 0 като 00.
4. 3. HTML-код за цвят:
• HTML-кода за бял цвят има
вида #FFFFFF, а HTML-кода
за черен цвят е #000000.
• <body bgcolor="#ffffff"
text="#000000">
• http://htmllessons.hit.bg/colors1
- таблица на 216 цвята и
техните 16-тични кодове
5. 4. Изображения
• Изображенията - картинки, фотографии и др.,
анимирани или статични - са важна част от почти
всеки сайт в мрежата. Добре подбрани и
разположени, те могат да "освежат" HTMLстраницата ви, но претрупването на една страница
с изображения може да постигне и обратния ефект,
като я направи непривлекателна. Освен това
използването на прекалено много изображения ще
направи страницата "тежка" и трудна за зареждане.
6. 5. Формати на файловете за изображения:
•
gif формат, който се използва предимно за картинки, илюстрации
и надписи, които не са оцветени в богата цветова гама и не
съдържат "сложни" оттенъци и светлосенки.
Файловете с разширение gif имат две важни предимства пред
другия основен формат:
- могат да съдържат "прозрачен" елемент в себе си - това
например може да е фона на буквите от някакъв надпис, който ще
прозира и под него ще се вижда фона на страницата. Тогава този
файл ще "пасва" на страници с различно оцветен фон.
- gif файловете могат да бъде анимирани - да съдържат движеща
се картинка.
•
jpeg или jpg формат (и двете разширения са валидни и
равностойни), който се използва предимно за висококачествени
фотографии. Възможностите на този формат за показване на
цветове и оттенъци са по-богати от тези на gif формата, но за
сметка на това jpg файла не може да бъде анимиран, нито да
съдържа прозрачни елементи.
7. 6. Търсене и сваляне на
изображения от WEB
• Безплатни изображения може да намерите като
търсите по ключови думи, например free images,
free animated gifs, free pictures, free graphics,
free clip art, free buttons, free backgrounds, free
interfaces и т.н.
• Записване на изображение с командата "Save
Picture As". Преди да вземете някое изображение
и да го използвате в страницата си е нужно да се
уверите, че то не е обект на авторското право и
че е безплатно!!!
8. 7. Показване на изображения
в HTML-документа
• <img src="myimage.gif" />
• По подразбиране изображението се
появява в лявата част на страницата. Ако
желаем да разположим изоброжението
вдясно или в средата на страницата
трябва да използваме тага <div> и
атрибута му align със съответните
стойности - left (което е и по
подразбиране), right и center.
Например
•
<div align="center">
<img src="Example.gif" />
</div>
9. 8.1. Атрибути на тага за
изображение:
• Атрибутите width и height задават
съответно ширина и височина на
изображението в пиксели.
• Атрибута alt задава алтернативно
название на изображението (текст, който
се показва, в случай, че браузърът не
може да зареди изображението).
• <img src="Example.gif" width="163"
height="73" alt="Image Example" />
10. 8.2. Атрибути на тага за
изображение:
• Атрибута align – подравняване на
изображението спрямо текста
• <img src="Example.gif" width="163" height="73"
align=“top/bottom/middle и др." />
• Атрибута hspace задава свободно
пространство отляво и отдясно на
изображението, а атрибута vspace отгоре и отдолу. Стойностите са в
пиксели.
