Using ID and CLASS Attributes
THESE PAGES ARE STILL UNDER CONSTRUCTION AND DO NOT NECESSARELY REFLECT THE CURRENT VERSION OF TÓPICO
Along with the <div> and <span> elements, the id and class attributes make for a very flexible yet simple framework to define most of the semantic markup small to medium projects might require.
The id attribute
The id attribute uniquely identifies an element in a file. This makes it possible for the stylesheet or scripting to easily target this element for styling or processing.
The following element:
<div id="sidebar">sidebar content</div>
... can be styled as a right floated side bar with the following CSS selector:
div#sidebar {width:160; float:right;}
... and can be accessed with this JavaScript:
document.getElementById("sidebar");
The class attribute
The class attribute is used to share the same style among multiple elements. In some way, id could be seen as a first mames while class would be the family name. Different elements can also share a class without sharing all the attributes.
Let's say we have these elements:
<div id="sidebar" class="left">sidebar content</div> <p class="left">paragraph content</p>
A stylesheet could set both elements to have a white background, indent the paragraph and float the sidebar:
.left {background:white;} p.left {margin-left:20px;} div#sidebar.left {width:160; float:left;}
THESE PAGES ARE STILL UNDER CONSTRUCTION AND DO NOT NECESSARELY REFLECT THE CURRENT VERSION OF TÓPICO