If you’re hiring a web developer, or if you’re looking into a career as a web developer, then CSS (Cascading Style Sheets) is one of the basic tools you need to know about.  Next to HTML, CSS is one of the most basic and important tools in a web developers toolbox.

Why? CSS is like HTML’s stylish younger brother. HTML builds the basic structure of your web page and fills in the content. Then CSS comes in to make the content pop with colors, typography and positioning.

HTML Came First

In the old days, before the World Wide Web Consortium (www.w3.org) invented CSS, we built web pages with HTML tags and tables.  We still use HTML tags and tables, but CSS revolutionized web page design by separating content from style. Before CSS, things like fonts, colors and positioning were all handled within the HTML. Now the fonts, colors and positioning are set with CSS.

HTMLCSS
  • Sets the basic structure of a document by breaking the content into sections such as  body, paragraph, heading, list.
  • Sections the document into elements that can be styled with CSS.
  • Contains the basic content and meaning of the document.
  • Sets the presentation of the HTML elements by setting properties that determine the font style, color, position, background image.
  • Tells the browser how to display the HTML elements.
  • Adds pizzazz and unifies the style of a web site.

Key Benefits of CSS

Consistency: You style your entire website in the CSS instead of having to style each web page individually via HTML. This gives your web site a consistent style and a more professional appearance.

Save time: If you want to change the color of the headings for your website, you only need to change the code in one place.

Reusable and Extendable:  You can style an unlimited number of web pages with one CSS style sheet

CSS3 – the Next Generation of CSS

CSS3 is like CSS (Cascading Style Sheets) on steroids. It makes it easier for web developers to create better looking, faster loading web pages. How? CSS3 allows you to add things like text effects, transformations, rounded corners and drop shadows to your content through code alone. CSS3 creates the image for you on the fly. You don’t need to create the image in a separate graphics program like Photoshop. This speeds up your page load time because the browser can render the visual effects without having to load image files.
Learn more about CSS and CSS3 with W3schools.com

CSS3 Is Not Quite There

Just like HTML5, CSS3 is still under development so it does not work consistently with older browsers. However, newer browsers are compatible with most of the features of CSS3 – so please keep your browser up-to-date!

Learn More About CSS and CSS3

If you’re just getting started with CSS and you want to learn more, checkout http://w3schools.com/css/ for free tutorials and a complete easy-to-use reference.

 

Related Articles

Get the Latest Posts from Stafflink

Get blog updates from Stafflink