ID and Classes in HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ID and Classes</title>
<style>
.heading1{
color: red;
}
.lines{
color: blue;
}
#heading2{
color: brown;
}
#lines2{
color: purple;
}
.green{
color: green;
}
</style>
</head>
<body>
<!-- Below shown class mainly used for styling purpose -->
<!-- class can be repeat but id must be unique in one web page -->
<h2 class="heading1">This is heading</h2>
<p class="lines">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores alias neque
quisquam incidunt voluptate illo, praesentium quas tenetur earum consequuntur!
Dolorum hic, reiciendis repellat omnis minus alias illum quibusdam est odit
dolorem illo esse accusamus eveniet enim dolor veritatis ipsa.</p>
<h2 id="heading2">This is also heading</h2>
<p id="lines2">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Distinctio animi quo
sequi enim rem facilis iusto, fuga quisquam error perspiciatis nihil porro neque!
Repellat, neque quam! Sequi quam explicabo quo!</p>
<h2 class="green">This is also heading 3</h2>
<p class="green">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi placeat maxime error
optio vel nostrum veritatis cupiditate quasi hic inventore dolore ab unde culpa sunt nobis,
quas laboriosam consequuntur at.
</p>
<!-- Mostly from developers perspective, class can be repeat but id can not be repeat
id must be unique but class can be repeat. This is developers conventions. This is
not Rule. -->
</body>
</html>
Comments
Post a Comment