html attributes
Html Attributes

Attributes in HTML

HTML elements can have attributes. Attributes provide additional information about an element. Attributes are always specified in the start tag. Attributes come in name/value pairs like: name="value". Earlier many presentational attributes were used, like align, valign, bgcolor etc, but now in HTML5, these tags are removed.

List of Attributes in html

Attribute Name Description Example
bgcolor Background Color of the document

(Removed in HTML5)

<body bgcolor="aqua">
background Background Image of the document

(Removed in HTML5)

<body background="img/bg.png">
align Align left, right, center

(Removed in HTML5)

<p align="center">
valign Align top, middle, bottom

(Removed in HTML5)

<p valign="middle">
cellspacing change space (margin) between table cells

(Removed in HTML5)

<table cellspacing="10px">
cellpadding inner space ( padding) between table cells

(Removed in HTML5)

<table cellspacing="10px">
size Declare size of font and input <input size="4">
bottom margin Margin from bottom

(Removed in HTML5)

<body bottommargin="20">
top margin Margin from top

(Removed in HTML5)

<body topmargin="10">
class Specifies a class name for an element <div class="content">
id Specifies a unique id for an element <div id="banner">
style CSS attribute for tags(Specifies an inline style for an element) <div style="color:red">
title Specifies extra information about an element (displayed as a tool tip) <img src="img/logo.png" alt="Tech Altum" title="Welcome to Tech Altum Tutorial">
typespecify type of input control.<input type="text">
langlanguage used in text<p lang="es">Holla amigo</p>
srcsource of media tags like image, iframe, audio and video<img src="pic.jpg" alt="">

Bgcolor

( removed in html5)

Used to give background color to body tag and table tag.

(How to create a Bgcolor)


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>title</title>
</head>
<body bgcolor="#999000">
		// content 
</body>
</html>

(Browser View)


Background

( removed in html5)

Used to give background image in html4 for body element.


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>title</title>
</head>
<body background="http://www.techaltum.com/images/TechAltumLogo.png">
		// content 
</body>
</html>		

Background Attribute Code


Align

( removed in html5)

Align Attribute is used to horizontally align text or tables.

(How to align text in html)


<h1 align="left">TEXT Aligned Left</h1>
<h1 align="center">TEXT Aligned Center</h1>
<h1 align="right">TEXT Aligned Right</h1>

Align Attribute Code

TEXT Aligned Left

TEXT Aligned Center

TEXT Aligned Right


Size

size Attribute is used define size to font tag and input tag.


	
<font size="2" > Font with size 2</font>
<font size="5" > Font with size 5</font>
<font size="7" > Font with size 7</font>

<input type="text" size="10" >
<input type="text" size="20" >


Class

Class attribute is used to define a group of elements having same css properties. Class can have single or multiple values with whitespace separation.

Class Attribute Code

Font with class red and bold

Font with class red

Font without class red


<style>
    .red{ color:red}
    .bold{ font-weight:bold}
</style>
		
<p class="red bold" > Font with class red and bold</p>
<p class="red" > Font with class red only</p>
<p> Font without class red</p>

ID

Id attribute is used to call a unique element. On a single webpage, an id cannot be repeated. An html element can have a single ID attribute and single value of id.

ID Attribute Code

Font with class red

Font with class red

Font with id blue


<style>
    .red{ color:red}
    #blue{ color:blue}
</style>
		
<p class="red" > Font with class red</p>
<p class="red" > Font with class red</p>
<p id="blue"> Font with id blue</p>