CreateaFreeWebsite  with Responsive Web Design

Creating Classes for HTML Elements

with the Class Attribute

The class attribute is a Global Attribute.

You can define a class for any web page element that accepts global attributes.

In HTML code it looks like this:
<div class="right"></div>

To define its properties in the style sheet it would be referenced as:
div.right {
properties here
}

Since the id attribute must be unique and only used once on a page, the class attribute is the preferred method of defining custom properties for HTML elements.

Example

To define the properties of an image inside div.right:
<div class="right">
<img src="image url" alt="alt text" >
</div>

To define its properties in the style sheet it would be referenced as:
div.right img {
margin : 10px 10px;
box-shadow: 1px 1px 4px #000 }

 

Free Tools We Recommend

Free Ebook How to Code in HTML5 and CSS3
"How to Code in HTML5 and CSS3" is a free e-book about making websites in HTML5 and CSS for absolute beginners. It doesn't require any experience in IT to start....
FREE HTML Editor (Windows): NoteTab Light
All the features of a commercial HTML editor.
FREE Apache Server (Windows): IndigoAmpp
Set up a real time server environment right on your PC. Test forms and scripts before uploading to your web space.
Linux Users
If like us, you've left the insane world of Microsoft Windows for the even worse experience of Linux, we recommend the Geany Code Editor. You'll find it in your Linux Mint software repository. It's simple but powerful and FREE.
For image resizing we've found the easiest Linux tool to be Krita.

Have you tried our Free Mobile Ready website template kit? Download Template #402 - 6 Page Kit