HTML Attributes

HTML Attributes

HTML attributes are special words which provide additional information about the elements or attributes are the modifier of the HTML element. Each element or tag can have attributes, which defines the behaviour of that element.

Attributes should always be applied with start tag. The Attribute should always be applied with its name and value pair. The Attributes name and values are case sensitive.

Syntax

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

Examples

<!DOCTYPE html>
<html>
<body>

<h2> This is HTMl attribute </h2>
<p style="height: 10px; color: blue"> paragraph content </p>

</body>
</html >

Output:

This is HTMl attribute


paragraph content


The href Attribute

The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to page.

<!DOCTYPE html>
<html>
<body>

<h3>The href Attribute</h3>
<a href="https://phpcoderspoint.com">Site</a>

</body>
</html >

Output:

The href Attribute


Site

The src Attribute

The <img> tag is used to embed an image in an HTML page. The src attribute specifies the path to the image to be displayed.

The <img> tag should also contain the width and height attributes, which specifies the width and height of the image (in pixels).

The required alt attribute for the <img> tag specifies an alternate text for an image, if the image for some reason cannot be displayed. This can be due to slow connection, or an error in the src attribute, or if the user uses a screen reader.

<!DOCTYPE html>
<html>
<body>

<h2>The src Attribute</h2>
<img src="my_img.jpg" width="400" height="200" alt="image_name">

</body>
</html>

Output:

The src Attribute


image_name


The style Attribute

The style attribute is used to add styles to an element, such as color, font, size, and more.

<!DOCTYPE html>
<html>
<body>

<p style="height: 10px; color: blue"> paragraph content </p>

</body>
</html >

Output:

paragraph content


The lang Attribute

You should always include the lang attribute inside the <html> tag, to declare the language of the Web page. This is meant to assist search engines and browsers, Country codes can also be added to the language code in the lang attribute. So, the first two characters define the language of the HTML page, and the last two characters define the country.

<!DOCTYPE html>
<html lang="en-IN">
<body>
...
</body>
</html>

The title Attribute

The title attribute defines some extra information about an element. The value of the title attribute will be displayed as a tooltip when you mouse over the element

<!DOCTYPE html>
<html>
<body>

<h2>The title Attribute</h2>
<p title="Paragraph tag tooltip">Paragraph tag</p>

</body>
</html>

Output:

The title Attribute


Paragraph tag


Always Quote Attribute Values

The HTML standard does not require quotes around attribute values.

<a href="https://phpcoderspoint.com">Visit our WEbsite</a>

Leave A Comment :