BigCommerce helps growing businesses, enterprise brands, and everything in-between sell more online.

What is CSS, and why is it important?

CSS stands for Cascading Style Sheets. It is the coding language that gives a website its look and layout. Along with HTML, CSS is fundamental to web design. Without it, websites would still be plain text on white backgrounds.

Before the development of CSS in 1996 by the World Wide Web Consortium (W3C), Web pages were extremely limited in both form and function. Early browsers presented a page as hypertext - plain text, images and links to other hypertext pages. There was no layout at all to speak of, merely paragraphs running across the page in a single column.

CSS allowed several innovations to webpage layout, such as the ability to:

  • Specify fonts other than the default for the browser

  • Specify color and size of text and links

  • Apply colors to backgrounds

  • Contain webpage elements in boxes and float those boxes to specific positions on the page

They put the "style" in style sheets, and for the first time, Web pages could be designed.

The first commercial browser to read and utilize CSS was Microsoft's Internet Explorer 3 in 1998. To this day, support for certain CSS functions varies from browser to browser. The W3C, which still oversees and creates Web standards, recently released a new standard for CSS - CSS3. With CSS3, developers hope that all major browsers will read and display every CSS function in the same way.

How does CSS work?

To understand the basics of how CSS works, you must first understand a little about modern HTML. Web developers lay out pages according to the "box model." A Web page is a series of boxes, each containing a discrete element. These boxes are nested, one inside another.

For example, a page's header is a box, and it contains several smaller boxes comprising all the elements that make up a header: logo, navigation, social media buttons, shopping cart buttons, etc. Using CSS, a developer assigns styles to the "header" box. In this example, let's assume that the developer makes the text inside the header purple, Arial font and fifteen points high.

Here's where the "cascading" part of cascading style sheets comes into play. The font styles applied to the header cascade down to all the elements contained inside the header. Elements containing text such as navigation, links or calls to action will all be purple, Arial and fifteen points high.

BigCommerce helps growing businesses, enterprise brands, and everything in-between sell more online.

Start growing your ecommerce business even faster.

High-volume or established business? Request a demo