HTML attributes provide additional information about HTML elements.

HTML Attributes

  • All HTML elements can have attributes
  • Attributes provide additional information about elements
  • Attributes are always specified in the start tag

HTML attributes provide additional information or modify the behavior of HTML elements. They are specified within the opening tag of an element and consist of a name and a value, separated by an equal sign (=) and enclosed in double quotes (""). Here's an explanation with examples:

The href attribute in the <a> (anchor) element:

<a href="https://www.betekie.com">Visit Betekie Website</a>

The href attribute specifies the URL that the link should navigate to. In this example, clicking on the link will take the user to "https://www.betekie.com".

The src attribute in the <img> (image) element:

<img src="image.jpg" alt="Description of the image">

The src attribute specifies the source URL of the image file to be displayed. In this example, the image file &quot;image.jpg&quot; will be loaded and shown on the web page. The alt attribute provides alternative text that is displayed if the image cannot be loaded or for accessibility purposes.

 

The class attribute for CSS styling:

 

<p class="highlighted">This paragraph has a special style.</p>

The class attribute is used to assign a CSS class to an HTML element. CSS classes define specific styles that can be applied to one or more elements. In this example, the paragraph will have a special style defined in the CSS class named &quot;highlighted&quot;.

 

The disabled attribute in the <button> element:

 

<button disabled>Disabled Button</button>

The disabled attribute disables the button and prevents it from being clicked or interacted with by the user. In this example, the button will be grayed out and unclickable.

 

The name attribute in form elements:

 

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

The name attribute is used in form elements to identify the input field when the form is submitted. It provides a name-value pair that is sent to the server upon form submission. In this example, the input field will be named &quot;username&quot;, and its value will be included when the form is submitted.

 

The lang attribute in html elements:

 

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.

The following example specifies English as the language:

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

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. The following example specifies English as the language and United States as the country:

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

Latest Tutorial

Newly published tutorials

How to Make an AWS S3 Bucket Public

Learn how we can make an AWS S3 bucket public

Laravel 10 - Tutorial to create CRUD Application

Learn to create crud application using laravel 10. Step by step guidance will help to understand the concept of crud.

Laravel - How to upload file to AWS S3 Bucket

Explore how we can upload file using the laravel on Amazon S3 bucket.