Home

What Does CSS Do?

|
Updated:  
2016-03-26 08:00:13
|
Getting Started with Coding
Explore Book
Buy On Amazon

Cascading Style Sheets (CSS) styles HTML elements with greater control than just using HTML. On the left of the image, Facebook appears as it currently exists; on the right, however, the same Facebook page is shown without all the CSS styling. Without the CSS, all the images and text appear left-justified, borders and shading disappear, and text has minimal formatting.

image0.jpg

CSS can style almost any HTML tag that creates a visible element on the page, including all the HTML tags used to create headings, paragraphs, links, images, lists, and tables t. Specifically, CSS allows you to style:

  • Text size, color, style, typeface, and alignment

  • Link color and style

  • Image size and alignment

  • List bullet styles and indentation

  • Table size, shading, borders, and alignment

CSS styles and positions the HTML elements that appear on a web page. However, some HTML elements (such as, for example, ) are not visible on the page and are not styled using CSS.

You may wonder why creating a separate language like CSS to handle styling was considered a better approach than expanding the capabilities of HTML. There are three reasons:

  • History: CSS was created four years after HTML as an experiment to see whether developers and consumers wanted extra styling effects. At the time, it was unclear whether CSS would be useful, and only some major browsers supported it. As a result, CSS was created separately from HTML to allow developers to build sites using just HTML.

  • Code management: Initially, some CSS functionality overlapped with existing HTML functionality. However, specifying styling effects in HTML results in cluttered and messy code. For example, specifying a particular font typeface in HTML requires that you include the font typeface attribute in every paragraph (

    ) tag.

    Styling a single paragraph this way is easy, but applying the font to a series of paragraphs (or an entire page or website) quickly becomes tedious. By contrast, CSS requires the typeface to be specified only once, and it automatically applies to all paragraphs.

    This feature makes it easier for developers to write and maintain code. In addition, separating the styling of the content from the actual content itself has allowed search engines and other automated website agents to more easily process the content on web pages.

  • Inertia: Currently millions of web pages use HTML and CSS separately, and every day that number grows. CSS started as a separate language, and it remains a separate language because its popularity continues to grow.

About This Article

This article is from the book: 

About the book author:

Nikhil Abraham was Director of Business Development & Growth at Codecademy. In that role, he taught and trained thousands of beginning coders across a variety of professions. He helped refine Codecademy's online courses, which have introduced basic coding skills to millions of learners.