Toni Petrov's IT Blog
неделя, 23 декември 2012 г.
Музика и видео
HTML позволява да вградите музикален фон в страницата си, както и да сложите връзки към ваши музикални и видео клипове, които потребителя да чуе и види чрез щракане върху съответните връзки.
Имайте предвид, че посетителя на вашата страница ще може да чуе и види вашите звукови и видео файлове само ако има на компютъра си програма за възпроизвеждането им и слушалки или тонколони. Повечето версии операционни системи и браузъри имат вградени програми за възпроизвеждане на аудио и видео файлове.
ФОРМАТИ НА ФАЙЛОВЕ ЗА ЗВУК И ВИДЕО
Дали един файл съдържа звукови или видео материали може да се разбере по файловия формат, т.е. по разширението на съответния файл.
1. Основните формати за звукови файлове са midi, mp3 и wav. Следователно ако видите файл с някое от тези разширения, например music.midi, song.mp3, sound.wav и пр., може да сте сигурни, че това е звуков файл.
2. Основните формати за видео файлове са avi, mpg и qt. Ако видите файл с такова разширение, например video.avi, clip.mpg и пр., това означава, че те съдържат някакъв филм/клип.
ВГРАЖДАНЕ НА МУЗИКАЛЕН ФОН В СТРАНИЦАТА
Изображения
В HTML се
използват два основни формата на файлове, съдържащи изображения:
1. gif формат, който се използва предимно за картинки, илюстрации и надписи, които не са оцветени в богата цветова гама и не съдържат "сложни" оттенъци и светлосенки.
Файловете с разширение gif имат две важни предимства пред другия основен формат:
- могат да съдържат "прозрачен" елемент в себе си - това например може да е фона на буквите от някакъв надпис, който ще прозира и под него ще се вижда фона на страницата. Тогава този файл ще "пасва" на страници с различно оцветен фон, освен ако на изображението не е зададен ефект "сянка" - тогава фона трябва да е същия, на който е правен ефекта.
- gif файловете могат да бъде анимирани - да съдържат движеща се картинка.
2. jpeg или jpg формат (и двете разширения са валидни и равностойни), който се използва предимно за висококачествени фотографии.
Възможностите на този формат за показване на цветове и оттенъци са по-богати от тези на gif формата, но за сметка на това jpg файла не може да бъде анимиран, нито да съдържа прозрачни елементи.
Съществува и още един файлов формат, който в момента се използава по-рядко.Това е png формата, който съдържа в себе си най-доброто от gif и jpg форматите.
1. gif формат, който се използва предимно за картинки, илюстрации и надписи, които не са оцветени в богата цветова гама и не съдържат "сложни" оттенъци и светлосенки.
Файловете с разширение gif имат две важни предимства пред другия основен формат:
- могат да съдържат "прозрачен" елемент в себе си - това например може да е фона на буквите от някакъв надпис, който ще прозира и под него ще се вижда фона на страницата. Тогава този файл ще "пасва" на страници с различно оцветен фон, освен ако на изображението не е зададен ефект "сянка" - тогава фона трябва да е същия, на който е правен ефекта.
- gif файловете могат да бъде анимирани - да съдържат движеща се картинка.
2. jpeg или jpg формат (и двете разширения са валидни и равностойни), който се използва предимно за висококачествени фотографии.
Възможностите на този формат за показване на цветове и оттенъци са по-богати от тези на gif формата, но за сметка на това jpg файла не може да бъде анимиран, нито да съдържа прозрачни елементи.
Съществува и още един файлов формат, който в момента се използава по-рядко.Това е png формата, който съдържа в себе си най-доброто от gif и jpg форматите.
Начини за обработване на формуляри
Всичко което научихте досега за формулярите е напълно безполезно ако не знаете
какво да правите с попълнената от клиента информация - как и къде се изпраща и
съхранява тя, така че да може да я използвате.
За да бъде използваем един формуляр той трябва задължително да притежава следните елементи:
1. Бутони
За да бъде използваем формуляра клиентът трябва да има възможност да съхрани и да изпрати за обработка попълнените данни. За целта в повечето случаи се използва бутона "Submit". Обикновено този бутон може да се види в края на формуляра. Чрез натискане на бутон "Submit" данните се изпращат за обработка и съхранение и по този начин завършва работата по попълването на формуляра.
За изработването на бутона "Submit" в HTML е предвидена следната команда:
<form>
<input type="submit" value="Submit" />
</form>
За да бъде използваем един формуляр той трябва задължително да притежава следните елементи:
1. Бутони
За да бъде използваем формуляра клиентът трябва да има възможност да съхрани и да изпрати за обработка попълнените данни. За целта в повечето случаи се използва бутона "Submit". Обикновено този бутон може да се види в края на формуляра. Чрез натискане на бутон "Submit" данните се изпращат за обработка и съхранение и по този начин завършва работата по попълването на формуляра.
За изработването на бутона "Submit" в HTML е предвидена следната команда:
<form>
<input type="submit" value="Submit" />
</form>
Формуляри
Формулярите са един от важните инструменти, особено когато става дума за изработване на интерактивна или комерсиална страница. Чрез формулярите вашите клиенти могат да дадат информация за себе си, да поръчат вашите продукти, да попълнят анкета, чрез която да се ориентирате какви са техните предпочитания, да дадат мнение по определен въпрос и пр. Т.е. формулярите са вид средство за обмяна на информация между разработчика на сайта и неговите посетители.
Всеки формуляр започва с отварящ таг <form> и завършва със затварящ таг </form>. Цялото съдържание на формуляра е заключено между тези два тага.
Почти всички елементи на формулярите се въвеждат чрез следващия по важност таг input, който може да съдържа няколко атрибута, най-важния от които е атрибута type. Тага input не притежава затварящ таг и затова наклонената затваряща черта се изписва в края на самия таг.
Всички тагове input и техните атрибути със съответните стойности се разполагат между двата основни тага <form> и </form>.
ПОЛЕ ЗА ТЕКСТ
Почти всеки формуляр съдържа поле за въвеждане на текст или няколко такива полета. На страницата тези полета се показват като правоъгълници, в които може да се въвежда текст.
За да се зададе поле за въвеждане на текст във формуляр, трябва да се въведе атрибута type на тага input и да му зададете стойност text:
Списъци
Често в HTML-страниците се прави изброяване на някакви елементи и в тези случаи е подходящо да се използват специалните тагове на HTML за списъци, тъй като това придава по-подреден вид на страницата.
Могат да се изработват три основни вида списъци:
- неподредени
- подредени
- дефиниращи
НЕПОДРЕДЕНИ СПИСЪЦИ
Неподреден е списъка, в който елементите, които се изброяват, не са номерирани чрез арабски цифри, римски цифри или букви.
Кода за такъв списък е следния:
<ul>
<li>Първи елемент от списъка</li>
<li>Втори елемент от списъка</li>
<li>Трети елемент от списъка</li>
</ul>
При задаване на този код браузъра изобразява списъка с автоматичен отстъп от лявото поле. Не е нужно и да се изписва тага за преминаване на следващ ред <br>, тъй като това също става автоматично. Автоматично се добавя и по един празен ред над и под списъка.
Таблици
Таблиците са
важен инструмент при създаването на една уеб-страница. Понякога цялата страница е
разположена в таблица, чиито редове и колони оформят различните части на
HTML-документа( в HTML5 това е семантично грешно).
Таблиците в HTML-документа са разположени между двата основни тага <table> и </table>.
Между тези два тага се изписват:
1. таговете за табличен ред - <tr> и </tr>
2. таговете за таблична клетка, чрез които се оформят редовете и колоните - <td> и </td>
За да има таблицата видими очертания трябва в тага table да се добави атрибута border и да му се зададе някаква стойност, например 1.
ДРУГИ ТАГОВЕ, КОИТО СЕ ПОЛЗВАТ В ТАБЛИЦИТЕ
Таблиците в HTML-документа са разположени между двата основни тага <table> и </table>.
Между тези два тага се изписват:
1. таговете за табличен ред - <tr> и </tr>
2. таговете за таблична клетка, чрез които се оформят редовете и колоните - <td> и </td>
За да има таблицата видими очертания трябва в тага table да се добави атрибута border и да му се зададе някаква стойност, например 1.
ДРУГИ ТАГОВЕ, КОИТО СЕ ПОЛЗВАТ В ТАБЛИЦИТЕ
Хипервръзки
Тагът за
хипервръзка е <a>, като на неговия атрибут href се задава за стойност
адреса, към който води връзката. Тагът има затварящ таг </a>.
ПРИМЕР: <a href="http://host.bg">Връзка към host.bg</a>
По подразбиране връзките се показват в браузъра сини на цвят и подчертани, а посетените връзки - виолетови. Цвета им може да бъде променен чрез атрибутите link, alink и vlink на тага body или чрез ползване на CSS(препоръчително).
Когато хипервръзката води до вътрешна страница от някакъв сайт, е необходимо да се укаже точния адрес на тази страница.
ПРИМЕР: <a href="http://host.bg">Връзка към host.bg</a>
По подразбиране връзките се показват в браузъра сини на цвят и подчертани, а посетените връзки - виолетови. Цвета им може да бъде променен чрез атрибутите link, alink и vlink на тага body или чрез ползване на CSS(препоръчително).
Когато хипервръзката води до вътрешна страница от някакъв сайт, е необходимо да се укаже точния адрес на тази страница.
ХИПЕРВРЪЗКИ КЪМ СТРАНИЦИ ОТ ЕДИН И СЪЩ САЙТ
Освен към външни страници хипервръзките могат да водят към страници от един и същ сайт - по този начин той ще изглежда като един цял документ. В този случай не е задължително да се указва пълния адрес на дадена страница. Как точно ще се зададе адреса зависи от това в коя точно папка се намира страницата, към която се прави хипервръзка.
ХИПЕРВРЪЗКИ КЪМ ЧАСТИ ОТ ЕДНА И СЪЩА СТРАНИЦА
Абонамент за:
Публикации (Atom)