HTML Home
HTML Introduction
HTML Editors
HTML TAGS
HTML Paragraph
HTML Heading
HTML with CSS
HTML Text Formatting
HTML Quotation
HTML Comment
HTML Links
HTML Images
HTML Audio
HTML Video
HTML Tables
HTML Lists
HTML Class
HTML Iframes
HTML File Path
HTML Scripts
HTML Head Section
HTML Structure
HTML Symbols
HTML Character Set
HTML Entity
HTML Color Codes
HTML Forms
HTML Forms
HTML Form Elements
HTML5 Form Element
HTML Form Attributes
HTML Others
HTML Class is attribute of HTML tag. Its use with HTML tag like: <div>, <p>, <span> and also <table> and all HTML tag. HTML Class is most important element of website. If any developer want to develop a website so his should be complete learn of HTML Class. An Class define only one and it's declare multiple place.
How to declare HTML Class?
HTML Class declare in a Style. The first of step for declare HTML Class write <style> div.classname </style>.
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Class Tutorials</title>
<style type="text/css">
div.box
{
width:95%;
float: left;
padding: 20px;
background:#999;
border:2px solid red;
margin-top:20px;
}
</style>
</head>
<body>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Class Tutorials</title>
<style type="text/css">
div.box
{
width:95%;
float: left;
padding: 20px;
background:#999;
border:2px solid red;
margin-top:20px;
border-radius: 40px;
}
</style>
</head>
<body>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML Class Tutorials</title>
<style type="text/css">
div.box
{
width:15%;
height: 200px;
float: left;
padding: 20px;
background:#ddd;
border:2px solid red;
margin:5px;
border-radius: 4px;
font-size: 14px;
}
</style>
</head>
<body>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
<div class="box"> <!-- Here declare your class -->
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
</div>
<div class="box"> <!-- Here declare your class -->
<img src="../uploads/sample.png" width="100%" height="100%">
</div>
</body>
</html>
