17 Jul 2016

Html Attributes

Posted in HTML By bestonetechnologies On July 17, 2016

Attributes are used to define the additional information about HTML elements. It placed inside the element’s opening and tag. All attributes in HTML comes in two parts Name and value pairs, separated by =.

Let’s take an example of title attribute:

Title Attribute

Output:

When we mouse over on the anchor tag, the title will display “Click here to Sign-Up” as a tooltip.

href is also an attribute in above example, We can provide navigation link in it like:

Align Attribute

Use of Align attribute with paragraph:

<html>
<head>
<title>Align Attribute </title>
</head>
<body>
This para is left aligned
This para is center aligned
This para is right aligned
</body>
</html>

Style Attribute

Use of Style attribute:

Style attribute allows us to define Cascading Style Sheet (CSS) rules within the element.

<html>
<head>
<title>Style Attribute </title>
</head>
<body>
This para is left aligned
This para is center aligned
</body>
</html>

Class Attribute

The class attribute is also allows us to define css rules with the element, but in class we can define multiple styles and re-use with different html elements.

Let’s take an example:

<html>
<head>
<title>Class Attribute </title>
<style>
.class1 { color:red; background:cyan; }
.class2 { font-size:24px; font-weight:bold; }
</style>
</head>
<body>
This para is using css class1.
This para is usint css class2.
This para is using css class1 again.
This para is using css class2 again.
</body>
</html>

List of some global html attributes

Attribute	Description
id	(unique id for an element)
lang	(define the language of the element’s content)
style	(define inline CSS style for an element)
title	(tool-tip OR information about an element)
class	(define CSS style for an element with using class)
dir	(define language direction)
accesskey	(define a keyboard shortcut key)
tabindex	(define the tab order index for the element)