HTML Attribute

HTML attributes are special words that provide additional information about HTML elements, modifying their behavior and appearance. They are essential for specifying the properties and characteristics of HTML tags.

Key Points about HTML Attributes:

Additional Information: Attributes add extra information to elements, defining their behavior and appearance.

Element-Specific: Each HTML element or tag can have specific attributes associated with it.

Placement: Attributes should always be included within the opening tag of an element.

Name-Value Pairs: Attributes are defined using a name-value pair format: name="value".

Case Sensitivity: Attribute names and values are case sensitive. The W3C recommends writing them in lowercase.

Multiple Attributes: You can apply multiple attributes to a single HTML element, separating each attribute with a space.

Syntax of HTML Attributes:

<element attribute_name="value">content</element>

Example:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1> This is Style attribute</h1>
<p style="width: 50px; color: green">It will add style property in element</p>
<p style="color: pink">It will change the color of content</p>
</body>
</html>

The title Attribute in HTML

Description: The title attribute provides additional information about an element, displayed as a tooltip when the user hovers over the element. It can be used with various HTML elements, such as links, paragraphs, and headings, to show descriptions or extra context

Example:

<!DOCTYPE html>
<html>
<head>
<title>Title Attribute Example</title>
</head>
<body>
<h1 title="Main Heading">Welcome to My Web Page</h1>
<p title="This is a paragraph.">Hover over this paragraph to see the tooltip.</p>
</body>
</html>

<a href="https://waytocode.in/">This is a link</a>

The src Attribute

Description: The src (source) attribute is a crucial and required attribute of the <img> element in HTML. It specifies the path to the image that you want to display in the browser. The src attribute can reference an image file located in the same directory as the HTML document or in a different directory.

Key Points

Primary Use: Specifies the path to the image file.

Path Types: Can be a relative path (same directory) or an absolute path (different directory)

Correct Source: Ensure the image path is accurate; otherwise, the browser will not display the image.

Example:

<img src="waytocode.jpg" height="100" width="200">