Съдържание
Има моменти, когато не всичко е за генериране на формуляр в нашите HTML документи, много пъти трябва да включваме други елементи, като изображения в някои тагове, за да оформяме страницата си, за това ще видим в този урок как да го направим и различните функции включена в самата нея.За да покажем изображение в нашия HTML документ, трябва да използваме елемента img който има следните атрибути:
- src
- alt
- височина
- ширина
- usemap
- ismap
В момента ще се съсредоточим върху първите два атрибута, src Y alt; src ни позволява да дадем пътя, от който браузърът ще търси изображението, той може да бъде относителен път или дори URL, атрибута alt ни позволява да поставим текст, този текст ще се показва само когато изображението не е налично, независимо дали не е по пътя, по който е посочено в src или дори браузърът не може да го интерпретира.
Нека да видим пример за това как да включим изображение в нашия HTML документ:
Пример Ето една обща форма за представяне на трите дейности в триатлон. Първата икона представлява плуване, втората - колоездене, а третата - бягане.
В този пример виждаме и още два атрибута, ширина и височина Както показват имената им, те трябва да регулират ширината и височината на изображението, като с това можем да гарантираме, че изображението ще остане в рамките на установените от нас размери, също и ако изображението е по-голямо от това, то ще бъде преоразмерено, без Въпреки това трябва да се внимава, тъй като изображението ще има същото тегло, така че е препоръчително да поставите вече редактираното изображение с необходимия размер и страницата ни да се зарежда по -бързо.
Друга доста често срещана употреба е да се използва изображение като връзка към други страници, или чрез поставяне на иконата на екип, следваща стрелка например, разбира се, сега с новите CSS рамки това може да е по -рядко, но нека видим как направено е да имаме тази опция в нашето портфолио от HTML инструменти.
За да вградим изображението, просто ще поставим елемента img вътре в елемент, който се отнася до страница, като например:
Пример Ето една обща форма за представяне на трите дейности в триатлон. Първата икона представлява плуване, втората - колоездене, а третата - бягане.
С това постигаме, че изображението вече е нашата връзка, както ще видим на следващия екран, изображението не се променя по начина, по който е показано:
Ако кликнете върху изображението, това ще ни отведе до местоназначението, поставено вътре в елемента; ако използваме атрибута ismap освен това ще изпратим координатите на позицията в изображението, където сме кликнали, за да можем да работим с тези числа в следващия момент от нашия навигационен процес. С това приключваме този урок, сега можем да направим по -богати страници, използвайки изображения, като можем да взаимодействаме с тях дори с точките, където потребителят може да кликне.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка