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 HTML element is <element>. The attribute names are name1 and name2.
- 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>Specifies the URL of an external resource, like an image or script.Provides a URL for a link.Adds a tooltip that appears when the user hovers over the element.Specifies the value of an input element (used in forms).
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>
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>
12. readonly: Makes input elements non-editable.
<input type="text" value="Read Only" readonly>
13. maxlength: Limits the number of characters allowed in an input field.
<input type="text" maxlength="10">
14. data-*: Custom data attributes used to store extra information.
<div data-user-id="123">User Information</div>