Dec 23 2012

Introduction to CSS scripts

CSS is a powerful web based (HTTP) coding system that can integrate into variety of other languages such as PHP, HTML, JavaScript and C#. Therefore, it is a useful language. Each and every programming language have it’s own set of libraries full of short codes. If you are new to Cascading Style Sheets (CSS) or programming in general, the basics to learning any language is to understand the basic parameters and libraries. I would spend a a considerable amount of time on those built-in parameters because it is your foundation for rest of your coding carrier.

Commenting in CSS

Commenting is as impotent as the coding itself. Most educators will force their students to properly comment their Computer Science assignments before even get into the code itself. To add a comment in CSS, you use /* for start of the comment and end with */. Usually the beginning and the end tags are typed on independent lines from rest of the comment.

/*
This is a comment in CSS
*/

At the end or before the comments close tag, the CSS code (whatever it is) can be placed. Like any other code make sure the comments are meaningful and add value to the CSS file. The following code is a good example of proper comments that reflects what a CSS file do.

/*
Contact Form Formatting: check box alignment fix
*/
#jam-free a {
  float: left;
  margin: 18px 30px 0 0;
}
/*
Hay, did you know! You can write anything including tags like { display: block;
width: 99em;
}
The codes inside comments will NOT effect any of the parameters in the CSS file itself
PLUG-IN: CONTACT FORM 7 CHECK BOXES SETTINGS
*/
span.bbc-jambox span.jamlist-item { display: block;
text-align:right;
width: 44em;
text-indent: -15px;
text-padding: 5px;
}

Comments are often used for providing information on what a CSS file can do and can be used to instruct user and other programmers what each code segment, parameter(selector) and variable (property/value) can do. I will explain each element of the code segment above in my next post.

Like always, happy coding…

Permanent link to this article: http://sanuja.com/blog/introduction-to-css-scripts