HTML Tutorial || Attributes

Item: HTML Tutorial || Attributes
Author: Ajil Krishna

author

April 28, 2020 January 27, 2024

HTML Attributes

Attributes contain additional pieces of information. Attributes take the form of an opening tag and additional info is placed inside.
The Attribute should always be applied with its name and value pair.

example

<img src="flower.jpg" alt="flower name.">

the image source (src) and the alt text (alt) are attributes of the <img> tag.

Major Attributes

The eight major attributes that can be used on the majority of HTML elements

Id attributes
Title attributes
Class attributes
Style attributes
href Attribute
src Attribute
lang Attribute
width and height Attributes

Id Attribute

id attribute of an HTML tag can be used to uniquely identify any element

example

<p id = "first">This is the first par</p>
<p id = "second">This is the second para</p>

Title Attribute

title attribute gives a suggested title for the element

example

<p title = "first">This is the first par</p>
<p title = "second">This is the second para</p>

Class Attribute

class attribute is used to associate an element with a style sheet, and specifies the class of element

example

class = "className1 className2 className3"





<p class = "first title">This is the first par</p>
<p class = "second bold">This is the second para</p>

style Attribute

style attribute allows you to specify Cascading Style Sheet (CSS) rules within the element

style attribute is used to specify the styling of an element, like color, font, size etc.

example

<p style="color:red">This is the first par</p>
<p style="color:blue">This is the second para</p>

href Attribute

href attribute is the main attribute of <a> anchor tag. This attribute gives the link address which is specified in that link

example

<a href="https://www.4utechie.com/">This is the first par</p>

src Attribute

src attribute is one of the important and required attribute of <img> element

example

<img src="flower.jpg">

lang Attribute

lang attribute allows you to indicate the main language used in a document,language is declared with the lang attribute.

example

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

   <head>
      <title>Page title</title>
   </head>

   <body>
      This page is using English Language
   </body>

</html>

width and height Attributes

width Specifies the width of tables, images, or table cells

height Specifies the height of tables, images, or table cells

example

<img src="flower.jpg" width="500" height="600">

other attributes

Attribute	Options	use
align	right, left, center	Horizontally aligns tags
valign	top, middle, bottom	Vertically aligns tags within an HTML element.
bgcolor	numeric, hexidecimal, RGB values	Places a background color behind an element
background	URL	Places a background image behind an element

HTML Programming Tutorial