Classes and IDs in HTML
In the HTML 5 and CSS 3, the tag names ,
classes and IDs are used for naming purposes. Just think of the condition where
you are creating a long Web page then there is a need of multiple sections. In
such a situation you will define many div or section tags. But the question is
this that how you will design the same divs with different styles having same
name. In such a situation you need to give names to each div , so the concept
of classes and Ids come into light .
1.
ID : IDs are given to the
elements that are unique on the web page and the same ID can’t be given to the
two different elements .
Id names are started with the
‘#’ e.g. “ #IDname { //Properties } “
2.
Class : Classes can be given
to more than one element on the same page.
Class names are started with ‘.’ E.g. “ .Classename { // Properties } “
Check out for good understanding[English]
Check this for Hindi tutorial
//** Code **//
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<link rel="stylesheet"
type="text/css" href="style/intro.css">
</head>
<body>
<header
id="head"><h2>Coder99</h2></header>
<div class="one"> This is section
one</div>
<div class="two"> This is section
one</div>
<div class="three"> This is section
one</div>
</body>
</html>
//** CSS file as intro.css
**//
body
{
margin : 0px;
}
#head
{
background-color: black;
color: white;
padding: .5em;
margin-bottom: 2px;
}
.one
{
height: 7em;
width: 15em;
padding: .3em;
background-color: blue;
}
.two
{
height: 7em;
width: 15em;
padding: .3em;
background-color: grey;
}
.three
{
height: 7em;
width: 15em;
padding: .3em;
background-color: red;
}
//** Save the file and enjoy
**//
Comments
Post a Comment