HTML TUTORIAL IN HINDI
- Introduction
- Basic Tags
- First Webpages
- Attributes
- Formatting
- Meta Tags
- Comment Tags
- Images Tags
- Table Tags
- List Tags
- LInk Tags
- List Tags
- Frame Tags
- Block Tags
- Background
- Color
- Fonts Tags
- Form Tags
- Heading
- Marquees
- Embed Multimedia
- Layout
HTML TUTORIAL: IMAGE TAG
- Introduction to HTML Image
- Syntax of HTML Image
- Attribute of Image
- Inserting image in HTML page
INTRODUCTION TO HTML IMAGE
Image kisi bhi webpage ko
attractive banate hai. agar do site par ek hi topic par post likha hai, ek me
only text lekha and dusre me text aur image dono. Jab bhi user dono site par
visit karega to text ki bajay jispar image laga hoga ussi par visit kar ke
jyada der tak rahega Q ki ek text ke mukable ek image bhut kuch batata hai.
HTML page ko attractive
aur beautiful banane ke liye koi bhi image add kar sakte hai. iske liye aapko
<img> tag ki madat leni hogi. <img> tag ek empty taghota hai jiske
sath koi closing tag nahi hota hai.
HTML document me image
insert karte samay koi bhi format le sakte hai. jaise: png,jpeg, gifs etc.
image jis format me hai ussi format me batana hoga.
Image kis format me hai
janne ke liye image par mouse ki right click karke property par click kare uske
badh aapko image ki location, format, size etc mil jayega.
SYNTAX OF IMAGE TAG
HTML document me image
insert karne ke liye syntax niche diya jar aha hai.
<img scr= “logo.png”>
Syntax me <img>
image ko define karta hai aur src uski location ko.
Src attribute important
hone ke sath isme use hone wali image URL ko “” Double Quotation Mark ke vitar
likha jata hai.
Webpage par image add
karte samay image ki name jaisi hai “yfttechhindi- logo.png वा yfttechhndi.png” waise hai
src attribute me likhna hoga.
ATTRIBUTE OF IMAGE TAG
Image tag ke sath bhut
sara attribute hota hai. uski list niche diya jaa raha hai.
- Src: Is attribute ki madat se image ki source or URL ko define kar sakte hai.
- Alt: Is attribute ki madat se image ke bare me bata sakte hai.
- Style: Is attribute ko image par css rules ko apply karne ke liye kiya jaata hai.
- Width & Height: Yeh dono attribute alag hai aur iske dwara image width aur height ko define kar sakte hai.
- Title: Yeh attribute ki title datsata hai.
- Border: Image ki border kitni ho wo is attribute ki madat se kar sakte hai.
- Aligh: is attribute ki madat se image alignment ko define kar sakte hai.
INSERTING IMAGE IN HTML PAGE
Image insert karne ke liye
aapko <img> tag ko use karna hoga. <img> tag ke sath aapko src
attribute ko bhi lagana hoga.
Src attribute chodkar baki
sabhi attribute optional me use kar sakte hai. Iske related example niche diya
jata hai,
<!DOCTYPE
html>
<html>
<head>
<title>Inserting
image</title>
</head>
<body>
<img
src= "yfttechhindi logo.png">
</body>
</html>
|
Result:
Aapne dekha ki ek image
insert ke liye <img> tag aur uski src attribute ko use kiya, result me
image insert ho gaya.
ALTERNATIVE TEXT WITH IMAGE
Apne page par image use
karte hai to thick hai magar kuch karan se kabhi wo image show nahi huwa, uske
liye alternative text ko use kar sakte hai ta ki image show na hone par text
show ho.
Example:
<!DOCTYPE
html>
<html>
<head>
<title>Inserting
image</title>
</head>
<body>
<img
src= "yfttechhindi logi.png" alt= "HTML Tutorial In
Hindi">
</body>
</html>
|
Result:
Result me aap dekh sakte
hai ki image show na hone par text show hogi.
MAKING IMAGE A LINK
Website aur website ka
page ka ek link hota hai, waise hi image ka bhi ek link hota hai. Image ka link
banane ke badh jabbhi koi uspar click karega to ek naya page open hoga. Iske liye
aap <img> tag ko <a> tag me likhna hoga. <a> tag anchor tag
hota hai, jisme aap <img> tag ko define karte hai
Example:
<!DOCTYPE
html>
<html>
<head>
<title>Inserting
image</title>
</head>
<body>
<a
href= "www.yfttechhindi.com">
<img
src= "logo.png"> </a>
</body>
</html>
|
Result:
WIDTH & HEIGHT OF IMAGE
Image ki width aur height
set karne ke liye aapko width and height attribute ko use karna hoga.
Example:
<!DOCTYPE
html>
<html>
<head>
<title>Inserting
image</title>
</head>
<body>
<a
href= "www.yfttechhindi.com">
<img
src= "logo.png" width= "300" height= "300">
</a>
</body>
</html>
|
Result:
BORDER OG IMAGE
Image ki border set karne
ke liye border attribute use kar sakte hai. iski value size hoti hai.
Example:
<!DOCTYPE
html>
<html>
<head>
<title>Inserting
image</title>
</head>
<body>
<a
href= "www.yfttechhindi.com">
<img
src= "logo.png" border= "8"> </a>
</body>
</html>
|
Result:
previous: Comment Tags
Next: Table Tags
HTML TUTORIAL: IMAGE TAG
Reviewed by Phaguni Mandal
on
12/04/2018
Rating:
Reviewed by Phaguni Mandal
on
12/04/2018
Rating:
No comments: