HTML урок 4 Цветове и изображения

Зарегистрируйтесь, чтобы просмотреть полный документ!

HTML – урок 4 Цветове и изображения

1. Обща информация: • цветовете на фона на страницата и на текста могат да се задават чрез изписване на английското название на съответния цвят, например: <font color="blue">Това е син текст</font> <body bgcolor="yellow"> (Задава жълт цвят на фона) • Не всички оттенъци могат да се изобразят чрез изписване на съответното английско название. • Не е препоръчително изобщо да използвате езиковите названия на цветовете, за да зададете цвят.

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.

3. HTML-код за цвят: • HTML-кода за бял цвят има вида #FFFFFF, а HTML-кода за черен цвят е #000000. • <body bgcolor="#ffffff" text="#000000"> • http: //htmllessons. hit. bg/col ors 16. html - таблица на 216 цвята и техните 16 -тични кодове

4. Изображения • Изображенията - картинки, фотографии и др. , анимирани или статични - са важна част от почти всеки сайт в мрежата. Добре подбрани и разположени, те могат да "освежат" HTMLстраницата ви, но претрупването на една страница с изображения може да постигне и обратния ефект, като я направи непривлекателна. Освен това използването на прекалено много изображения ще направи страницата "тежка" и трудна за зареждане.

5. Формати на файловете за изображения: • gif формат, който се използва предимно за картинки, илюстрации и надписи, които не са оцветени в богата цветова гама и не съдържат "сложни" оттенъци и светлосенки. Файловете с разширение gif имат две важни предимства пред другия основен формат: - могат да съдържат "прозрачен" елемент в себе си - това например може да е фона на буквите от някакъв надпис, който ще прозира и под него ще се вижда фона на страницата. Тогава този файл ще "пасва" на страници с различно оцветен фон. - gif файловете могат да бъде анимирани - да съдържат движеща се картинка. • jpeg или jpg формат (и двете разширения са валидни и равностойни), който се използва предимно за висококачествени фотографии. Възможностите на този формат за показване на цветове и оттенъци са по-богати от тези на gif формата, но за сметка на това jpg файла не може да бъде анимиран, нито да съдържа прозрачни елементи.

6. Търсене и сваляне на изображения от WEB • Безплатни изображения може да намерите като търсите по ключови думи, например free images, free animated gifs, free pictures, free graphics, free clip art, free buttons, free backgrounds, free interfaces и т. н. • Записване на изображение с командата "Save Picture As". Преди да вземете някое изображение и да го използвате в страницата си е нужно да се уверите, че то не е обект на авторското право и че е безплатно!!!

7. Показване на изображения в HTML-документа • <img src="myimage. gif" /> • По подразбиране изображението се появява в лявата част на страницата. Ако желаем да разположим изоброжението вдясно или в средата на страницата трябва да използваме тага <div> и атрибута му align със съответните стойности - left (което е и по подразбиране), right и center. Например <div align="center"> <img src="Example. gif" /> </div> •

8. 1. Атрибути на тага за изображение: • Атрибутите width и height задават съответно ширина и височина на изображението в пиксели. • Атрибута alt задава алтернативно название на изображението (текст, който се показва, в случай, че браузърът не може да зареди изображението). • <img src="Example. gif" width="163" height="73" alt="Image Example" />

8. 2. Атрибути на тага за изображение: • Атрибута align – подравняване на изображението спрямо текста • <img src="Example. gif" width="163" height="73" align=“top/bottom/middle и др. " /> • Атрибута hspace задава свободно пространство отляво и отдясно на изображението, а атрибута vspace отгоре и отдолу. Стойностите са в пиксели.

Скачать презентацию HTML урок 4 Цветове и изображения

c36a33d5f54d959a8d24b029c7a659a5.ppt

Количество слайдов: 10