Table of Contents
HTML Attributes
- Attributes किसी भी Element के बारे में Extra Information देते हैं.
- Attributes Element का Behavior बताते हैं.
- Attribute का Use हमेशा Start Tag के साथ किया जाता है.
- आप एक HTML Element में कितने भी Attribute Add कर सकते हो, उनमे Only Space देने की जरूरत होती है.
Syntax –
<element attribute = “value”> Content </element>
Style Attribute with Color Property
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<p style="color:red"> My Name is Mohit Kumar </p>
<p style="color:blue"> I am Going to Jaipur </p>
</body>
</html>
Result
Explanation
इस Program में हमने Style Attribute के साथ Color Property का Use किया है जो कि Text का Color Change कर देगा.
Style Attribute with height Property
इस Property के द्वारा हम दो Paragraphs के बीच की height Change कर सकते हैं.
Example
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<p style="height:40px"> By height Property, we can Change Height of two paragraphs </p>
<p style="height:40px"> By height Property, we can Change Height of two paragraphs </p>
</body>
</html>
Result
Title Attribute
इस Attribute का Use Tooltip / Text Hint के रूप में किया जाता है. जब User कर्सर को Text के ऊपर लेकर जाता है तो यह Attribute उस Text से Related Information Display करता है. इसका Use Paragraph Tag और Heading Tag के साथ किया जाता है.
Example
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<h1 title="I Love Money and Money Loves me so much"> This is an Example of Title Attribute </h1>
<p title="Help Toolkit"> Move the cursor over the heading and paragraph and you will see a description as a tooltip </p>
</body>
</html>
Result
HREF Attribute
Href attribute का Use <a> Tag यानि Anchor Tag के साथ किया जाता है. इसका Use Hyperlink बनाने के लिए किया जाता है. जब हम इस पर क्लिक करेंगे तो यह हमें एक दूसरे Page पर ले जायेगा.
Syntax –
<a href = “link address”> Content </a>
Example –
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<a href = "https://www.supportothers.org"> Arora Computer </a>
</body>
</html>
Result –
SRC Attribute
SRC Attribute का Use IMG Tag के साथ किया जाता है. इस Tag और Attribute का Use Browser पर Image Display कराने के लिए किया जाता है. Image Path / Source सही होना चाहिए नहीं तो Image Display नहीं होगी.
Syntax
<img src = “image path”>
Example
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<img src="web.jpeg">
</body>
</html>
Result
Width and Height Attributes
हम SRC Attribute के साथ Height और Width Attribute का भी Use कर सकते हैं. इससे हम Browser पर Display होने वाली Image की Height और Width control कर सकते है.
Syntax
<img src="image path" height="400" width="300">
Example
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<img src="web.jpeg" height="400" width="300">
</body>
</html>
Result
ALT Attribute
Img Tag के साथ Alt Attribute का Use करने पर यह उस Image के बारे में Alternative Text यानि उस Image के Information बताता है यदि किसी Reason से जैसे Slow Internet Connectivity या कुछ अन्य Image Display नहीं हो पाये.
Syntax
<img src="image path" alt= “This Image is about ALT Attribute”>
Example
<!DOCTYPE html>
<html>
<head>
<title> Arora Computer’s HTML </title>
</head>
<body>
<img src="web.jpg" alt="This Image Describe about alt attributes">
</body>
</html>
Result
Lang Attribute
Lang Attribute का Use <html> Tag के अन्दर किया जाता है. यह Attribute Webpage की Language बताता है. यह Search Engine और Browser को Webpage की Language समझने में Help करता है.
<!DOCTYPE html>
<html lang = “en”>
<head>
<title> -------------------- </title>
</head>
<body>
----------------------------------
----------------------------------
</body>
<html>
हम Language के साथ Country Code भी Add कर सकते हैं. इसमें पहले दो Characters Language तथा दूसरे दो Characters Country बताते हैं.
<!DOCTYPE html>
<html lang = “en-US”>
<head>
<title> -------------------- </title>
</head>
<body>
----------------------------------
----------------------------------
</body>
<html>