Classes and IDs

Classes and IDs exist in HTML to help elements interact with and can be manipulated by CSS selectors. Classes and IDs are usually declared using the class= or id= attributes.

This is a paragraph with a class of 'class-para'.

This is a paragraph with an id of 'id-para'.

It is standards-compliant to use only classes for styling in CSS. Only when you are working with Javascript elements, do IDs come in handy. It is a good idea fo CSS styling that you stick to using classes only.

In CSS, classes are selected using a dot (.) and IDs are selected using a (#).

Using CSS with HTML

When using CSS to style HTML elements, you should always use an external stylesheet. Unless it is for demo purposes, you should never write CSS directly into an HTML document.

Block and Inline

In HTML and CSS, there are two types of elements. Block Elements and Inline Elements. Block Elements take up the entire width of a box.Inline Elements, flow on the same line.

Examples of Block Elements: p, div, ul, ol, li, h1, h2, h3, h4, h5, h6

Examples of Inline Elements: span, a, img, strong, em

Sample of Block Elements

Heading (h1-h6) Are Block Elements

Samples of Inline Elements

This is an inline. Google

Linking HTML Pages and Working With Multiple Pages

Websites are composed of multiple HTML pages that allashare the same stylesheet. These differemt pages, are often linked together to form a navigation system for the website.

It is typical, that the index.html file is used as the homepage for a website. This is because most browsers will search out an index.html file to display first.

Usually, it is recommneded, that different pages of the same website share the same styling and overall structure. So, it is not uncommon for a designer/developer to copy code from the index.html file onto their sub or secondary pages.

Go to About Page