CSS (Cascading Style Sheets) is an integrated coding language that works well with HTML, XML, PHP, and many others. This is why you will come across the familiar HTML and XML tags within a CSS script.

Introduction to syntax

The libraries and per-defined variables in any language are known as syntax. In CSS, there are two main parameters; selector and declaration. A code segment will most likely (if not always) start with a single selector such as h3 and it can followed by either one or more declarations. A declaration must have one or more property(ties) and value(s). For example in the following code color is a property and red is a value. It is possible to have more than declaration along with respective properties as long as you close the previous one with proper closing tag, ; . You must include the closing tag at the end of each declaration unit.

NOTE: I have noticed my highlighter may not work properly. Pl, ignore the color coding.

/*
Intro to CSS syntax
Parameters demonstrated: selector and declaration
*/
h3 {color:red; font-size:5px;}
/*
Above can be written in separated lines as,
*/
h3 {color:red;
font-size:5px;}
/*
or
*/
h3
{color:red;
font-size:5px;}
/*
Another way to write a CSS modifier
*/
#jam-free a {
  float: left;
  margin: 18px 30px 0 0;
}

Why you may want to use separate lines

There is no rules stating that one must use either separate lines for each declaration and parameters. However, by unofficial convention, most web developers will use separate lines for each declaration. This will make it easy for a different user to look at the code and understand the algorithm behind it (of course don’t forget the good comments).

Let’s look at one of our selectors from the above code, h3 . What is “h3”? It is an HTML syntax used for headings smaller than h1 and h2 . The only difference in how HTML syntax differ from the CSS is that they are stylized using modifications such as color and the exact font size. While you can change these parameters within an HTML file itself (without CSS), it will increase the code base for the site. With the increase in codes, the performance of your site may significantly decrease. CSS based modifications can improve the quality of a site without sacrificing performance. If a CSS is well written, it can even reduce loading time of a web page all together.

CSS for site wide modifications

This language can be used to modify dynamic websites with complex pages with very little effort. If CSS is properly coded into the site at the development stage, with few lines of change, a webmaster will be able to change the appearance and/or behavior of several thousands of web pages in a single site. For example, if I want to change the top social bar great-black color of this website, I only have to modify the 2-3 lines of CSS code lines. It can change the color of the bar across every single page across my site. To perform the same operation with basic HTML, will take days (if not weeks) to go threw each page one at a time.

The integration of CSS with HTML, XML, PHP, JSP, etc makes it one of the most flexible ways to manipulate or add features to a website. It is the best tool for all web developers to save time and money during the stages of design, development, implementation and updates of any large scale websites.