- HTML attributes give additional information about HTML elements.
- Attributes are always specified in the start tag.
- You can add multiple attributes in one HTML element, but need to give a space between two attributes.
- Attributes usually come in name and value pair like: name="value".
Syntax for HTML Attributes:
-
<tagname attribute_name="value">Write the content</tagname>
HTML Core Attributes
-
The Core attributes that can be used on the majority of HTML elements.
- Id
- class
- Style
- Title
Note: All the Four core attributes will be discussed in the next chapters
The lang Attribute
- The lang attribute allows you to indicate the main language used in a document, but this attribute was kept in HTML only for backwards compatibility with earlier versions of HTML.
- You should always include the lang attribute inside the <html> tag, to declare the language of the Web page.
Example:
< !DOCTYPE html>
<html lang="en">
<head>
<title>The lang attribute</title>
</head>
<body>
</html>
<html lang="en">
<head>
<title>The lang attribute</title>
</head>
<body>
- This page is using English Language
</html>
The style Attribute
- The style attribute allows you to specify Cascading Style Sheet (CSS) rules within the element.
- The style attribute is used to add styles to an element, such as color, font, size, and more.
Example:
< !DOCTYPE html>
<html lang="en">
<head>
<title>The style attribute</title>
</head>
<body>
<h1>The style attribute for p tag<h1>
<p style = "color:#ff00ff; font-size:14px;">Write some content</p>
</body>
</html>
<html lang="en">
<head>
<title>The style attribute</title>
</head>
<body>
<h1>The style attribute for p tag<h1>
<p style = "color:#ff00ff; font-size:14px;">Write some content</p>
</body>
</html>
The title Attribute
- Title attribute is used as text tooltip in the browsers.
- Display its text when user move the cursor over a link or any text.
Example:
< !DOCTYPE html>
<html lang="en">
<head>
<title>The title attribute</title>
</head>
<body>
<h1>The title attribute for p tag<h1>
<p title="write content in the paragraph">Write some content</p>
</body>
</html>
<html lang="en">
<head>
<title>The title attribute</title>
</head>
<body>
<h1>The title attribute for p tag<h1>
<p title="write content in the paragraph">Write some content</p>
</body>
</html>
The href Attribute
- href attribute is the main attribute of <a> anchor tag.
- It gives the link address which is specified in that link.
Example:
< !DOCTYPE html>
<html lang="en">
<head>
<title>The href attribute</title>
</head>
<body>
<h1>The href attribute for a tag<h1>
<a href="https://www.technoasserts.com/">This is a link</p>
</body>
</html>
<html lang="en">
<head>
<title>The href attribute</title>
</head>
<body>
<h1>The href attribute for a tag<h1>
<a href="https://www.technoasserts.com/">This is a link</p>
</body>
</html>
Next Topic: HTML Headings