HTML Attributes

What are HTML Attributes?

HTML Attributes provide additional information to HTML-Elements.

Important points

You can put HTML Attributes in all types of HTML-Elements.
HTML Attributes provide additional information to HTML-Elements.
HTML Attributes should always be declare in the starting tags.
More than 100 HTML Attributes can be written in a the same starting tag.
HTML Attributes are always written in (name="value") Ex: Codingwith Anas.

Right way to insert HTML Attributes

HTML Attributes should always be declare in the starting tags and should always be written in form of (name="value"). The value of the HTML Attribute should always be written in Dubble Commas("value") else the the code will cause errors.

Wrong

Codingwith Anas

Right

Codingwith Anas

HTML href-Attributes

The Element <a> define Hyperlink. The href="" Attribute can hold Clickable URL and link of a page from your folder.

<a href="https://codingwithanas.com">This Is Absolute URL</a>
<a href="index.html">This Is Relative URL</a>

<a href="https://codingwithanas.com">This is Absolute URL</a>
<a href="index.html">This Is Relative URL</a>

HTML src-Attribute

The Element <img> is an Empty-Element which is used to declare that you are using an image in HTML document. The src="" Attribute hold the image path to be displayed.

<img src="assets/img/favicon.jpg">

HTML Height and Width Attribute

The Attribute height="" Is used to adjust Height and width=""

<img src="assets/img/favicon.jpg" height="200px" width="230px">

HTML Alt-Attribute

The alt="" Attribute is required in <img> tag, The alt="" Attribute declare alternate text for image, if due to some problem image will not be loded properly and get displayed then in the place of image the text in alt="" get displayed.

<img src="assets/img/favicon.jpg" alt="Image error your network in down" height="200px" width="230px">
<img src="assets/img/#favicon.jpg" alt="Image error your network in down" height="200px" width="230px">

HTML Style-Attribute

The style="" Attribute is used to add style to an HTML-Element Eby adding: color, front, size, weight and more.

Styled Codingwith Anas

<p style="color: blue;">Styled Codingwith Anas</p>

HTML Lang-Attribute

The lang="" Attribute should always be declared in the <html> tag to declare the language of the Web-Page. This is not displayed to users but it help the search engines and browser to understand the language of the page and the country where you want to rank your page the most. The first two characters is used to define languge of the page and the last two characters defines the country.

<!DOCTYPE html>
<html lang="en-US">
 <head>
 <title>Welcome to Codingwith Anas</title>
 </head>
<body>
 ...
</body>
</html>

<!DOCTYPE html>
<HTML lang="en-US">
    <head>
        <title>Welcome to Codingwith Anas</title>
    </head>
<body>
    
</body>
</html>

HTML title-Attribute

The title="" Attribute is used to define topic to give some more information to HTML-Elements.
When you take you mouse cursor that element its shows the topic of that element that you had written in the title="" Attribute.

<h1 title="This is heading title">About Codingwith Anas</h1>
I am a web developer and an online Tutor for all

<h1 title="This is heading title">About Codingwith Anas</h1>
<p title="This is paragraph title">I am a web developer and an online Tutor for all</p>