Friday, July 26, 2024

HTML Attributes


HTML attributes provide additional information about HTML elements. They are always included in the opening tag and typically come in name-value pairs, like class="classname". Common attributes include id, which uniquely identifies an element, src for the source of an image, and href for the destination URL of a link. Attributes such as style can be used to apply inline CSS directly to an element. These attributes enhance the functionality and presentation of HTML elements, enabling greater control over web content.

Here are some examples of HTML attributes and their uses:

href: Defines the URL for a link.

<a href="https://www.example.com">Visit Example</a>


src: Specifies the source file for an image.

<img src="image.jpg" alt="Example Image">


alt: Provides alternative text for an image.

<img src="image.jpg" alt="Example Image">


id: Uniquely identifies an element.

<div id="header">Header Content</div>


class: Assigns one or more class names to an element for CSS styling.

<p class="text-bold">Bold Text</p>


style: Applies inline CSS styles to an element.

<p style="color: red;">Red Text</p>


type: Specifies the type of input element in forms.

<input type="text" placeholder="Enter your name">


placeholder: Provides a hint for input fields.

<input type="text" placeholder="Enter your name">


title: Adds a tooltip text that appears when hovering over an element.

<button title="Submit Form">Submit</button>


value: Defines the initial value of an input field.

<input type="text" value="Default Text">

HTML Code:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>HTML Tutorial</title>

</head>

<body>

    <h1>HTML Attributes</h1>

    <p>HTML attributes provide additional information about elements. They are always included in the opening tag.</p>

    <pre>

        <a href="https://www.example.com">Visit Example</a>

        <p class="text-bold">Bold Text</p>

        <button title="Submit Form">Submit</button>

    </pre>

</body>

</html>


The Output of the above code:


HTML Tutorial

HTML Attributes

HTML attributes provide additional information about elements. They are always included in the opening tag.

        Visit Example
        

Bold Text