Learn HTML Attributes

In HTML5 we specifie the Attributes in the start tag, they provide information about an HTML element.

HTML attributes are used inside the opening tag to determine the element's behaviour

In HTML5 there are four types of attributes:

  • required attributes
  • optional attributes
  • standard attributes
  • event attributes

Part 1

HTML src Attribute

< img > tag is used to define images, the source of the image is defined in the HTML src Attribute

Code Example:

                     <img src="cybersecurity2.jpg">
Try yourself >>

If the image is in the same folder of the page, you can write < img src="cybersecurity2.jpg" >
but if the image is in external folder you would have to add the folder, example: < img src="../img/cybersecurity2.jpg" >
(the number of dots before the img folder is depend on the number of folders you have to reach.)

Part 2

HTML href Attribute

< a > tag is used to define HTML links, the address of the link is specified in the HTML href Attribute

Code Example:

                     <a href="https://www.freecodewiki.com/">Programming school</a>
Try yourself >>

Part 3

HTML alt Attribute

If the image exists but user cannot see the image, the HTML alt attribute is used to provide information about the image, so if the user is using software that reads the page, he will hear the information about the image.

Code Example:

                     <img src="cybersecurity2.jpg" alt="Code lines">
Try yourself >>

If the image does not exists, the alt attribute will show the text on the page:

Code Example:

                     <img src="jacksparrow.jpg" alt="Jack Sparrow is a pirate">
Try yourself >>

Part 4

HTML width and height Attributes

width and height attributes, are used to determine the width and height of the image:

Code Example:

                     <img src="cybersecurity2.jpg" width="400" height="500">
            <!-- pixels -->
Try yourself >>

The width and height are specified by pixels.

Part 5

HTML style Attribute

In HTML we use the style attribute to determine the styling of an element, such as font, color, size etc:

Code Example:

                     <p style="color:green; font-size:30px;">Jack Sparrow</p>
Try yourself >>

Learn more about styling in our CSS tutorial >>

Part 6

HTML title Attribute

In HTML we use the title attribute to show information when you hover above the element:

Code Example:

                     <p title="He is a pirate"> Jack Sparrow</p>
Try yourself >>

Part 7

HTML lang Attribute

In HTML we use the lang attribute to declare the language of the document, declaring a language is important for search engines and screen reading softwares:

Code Example:

                     <!DOCTYPE html>
<html lang="en-US">


FreeCodeWiki best way to learn html, enjoy this html programming language tutorial, we provide the best course for html and css for free