HTML Attribute
Additional information about the elements is provided by
attribute.
- All HTML components are capable of having attributes.
- Typically, attribute are expressed as name = value pairs.
The parts of html attribute
- A name and a value make up an attribute.
- The attribute names are name1 and name.
- An element's attribute provide it more capabilities or functionality.
- In the opening tag of the element, attributes are inserted.
- Any amount of characteristics can be applied to an element.
Syntax:
The href attribute;
<a href="https://www.gocourse.in/">Click GOCOURSE</a>
Common HTML Attributes
1. id:
<div
id="header">Header Content</div>
2. class: Specifies one or more class names for the element (used for CSS or JavaScript targeting). <p class="intro">Welcome to the website</p>
3. style: Adds inline CSS styling directly to an element. <h1 style="color: blue;">Blue Heading</h1>4. src:
<img src="image.jpg" alt="Sample Image">
5. href:
<a href="https://example.com">Visit Example</a>
6. alt: Provides alternative text for an image if it can't be displayed.
<img src="photo.jpg" alt="Photo of a sunset">
7. title:
<button title="Click here">Submit</button>
Specifies the value of an input element (used in forms).
8. target: Specifies where to open a linked document (often used with <a>). <a href="https://example.com" target="_blank">Open in New Tab</a>
9. type: Defines the type of an input element (used in forms). <input type="text" name="username">10. value:
<input type="submit" value="Submit">
11. placeholder: Provides a hint or description in input fields before the user enters data. <input type="text" placeholder="Enter your name">
12. disabled: Disables the element, preventing user interaction. <button disabled>Can't Click Me</button>
13. readonly: Makes input elements non-editable. <input type="text" value="Read Only" readonly>
14. maxlength: Limits the number of characters allowed in an input field. <input type="text" maxlength="10">
15. data-*: Custom data attributes used to store extra information. <div data-user-id="123">User Information</div>
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML
Attribute</title>
</head>
<body>
<h1>HTML
programming language</h1>
<p>To visit
our "Gocourse" website:<p>
<a href="https://www.gocourse.in/">Click GOCOURSE</a>
</body>
</html>
Output:
More topic in HTML
