CSS is a fantastic layout tool that allows you to add styling attributes to your website. This style language can help you more effectively enhance your website’s visual elements. CSS was designed as an enhancement to HTML that would provide more formatting opportunities and advanced layouts for web designers.
CSS solves the main issue with HTML of not being able to determine textual elements from advanced visual elements with some browsers in the past. In short, CSS are vital to ensure the distinction from document layout and document content.
One major advantage of CSS is that it allows developers to simultaneously be in control of multiple Web pages. In addition to visual styles, CSS also has an impact of non-visual styles such as how fast text is read out by aural text readers.
CSS is a syntax that consists of three main parts: 1. Selector 2. Property 3. Value. For those who are not familiar with how a syntax works, I will supply the following explanation provided by W3schools:
selector {property: value}
|
The selector is normally the HTML element/tag you wish to define, the property is the attribute you wish to change, and each property can take a value. The property and value are separated by a colon, and surrounded by curly braces:
body {color: black}
|
Note: If the value is multiple words, put quotes around the value:
p {font-family: “sans serif”}
|
Note: If you wish to specify more than one property, you must separate each property with a semicolon. The example below shows how to define a center aligned paragraph, with a red text color:
p {text-align:center;color:red}
|
To make the style definitions more readable, you can describe one property on each line, like this:
p
{
text-align: center;
color: black;
font-family: arial
}
|
If you feel comfortable with your basic HTML skills and wish to proceed with an online tutorial click here. Otherwise, to receive a free CSS template click here.