CSS is an abbreviation for Cascading Style Sheets. CSS is a markup language used to style and layout content marked up with HTML.

There are two aspects to learning CSS.

• CSS properties

• Applying CSS properties to HTML elements

What are CSS properties?

CSS defines properties and the values that can style the visual presentation of HTML elements. These includes properties such colors, background images, margins, borders, widths, heights, positioning, fonts and many others.

This example is setting red as the color of text using the color property and red which one of the defined color word values.

color:red

This example sets the font to Helvetica using the font-family property:

font-family:Helvetica

You will take a closer look at CSS properties in an upcoming lesson in this section and throughout the course.

How are CSS properties applied to HTML elements?

CSS properties are applied to HTML elements as follows

• The web browser optionally may apply styles to HTML elements. For example boldface is applied to the h1, h2, … h6 elements.

• Using CSS selectors in the HTML style element or in a linked CSS document.

  For example selecting the h1 element and applying the color property …

  h1 {color:red;}

  
  

  …  or more than one CSS property …

  h1 {color:red;text-align:center;}

  
  

  The selector is h1 and CSS searches the HTML document to find all h1 elements to apply the CSS properties listed inside the curly brackets.

  The previous example shows one of many kinds of CSS selectors. The details surrounding using CSS selectors are explored in another lesson in this section and throughout the course.

• Adding the style attribute on any HTML element that can be styled.

  For example applying color to the h1 element using the style attribute. …

  <h1 style="color:red;">How to Boil Water</h1>

  
  

  …  or more than one CSS property …

  <h1 style="color:red;text-align:center;">How to Boil Water</h1>

  
  

What is a CSS Document?

A CSS document is plain text file that includes the CSS selectors and properties. CSS documents can be shared by several HTML documents.

Is CSS programming?

CSS is not a programming language but has rules you need to follow like any computer programming language. So as you create or edit CSS you are considered to be coding but less likely to be considered programming or a programmer.

Web Browsers and CSS

Web browsers use CSS when rendering an HTML document as a web page for visitors to see. Web browsers developer tools can also show you how the CSS was applied to the elements and content in an HTML document.

CSS and SEO

CSS is meant for visual consumption of an HTML document. CSS has limited to no value for the internet or for Search Engine Optimization. For example you can use CSS properties to set boldfaced or italicized text as shown in these two examples.

font-weight:bold;

font-style:italic;

They do not imply important or emphasized meanings that the strong and em HTML elements provide.

<p><strong>Stop!</strong> and read all instructions <em>before</em> proceeding.</p>

World Wide Web Consortium

Abbreviated as W3C, the World Wide Web Consortium is an international community that works with the public and its members to develop standards for the Web. They maintain a web presence for the development of CSS, W3C CSS Home Page.

CSS is an open source specification maintained by the W3C. Open source means that CSS is freely available to use by anyone. Developers that write software rely on the W3C for direction and specifications for CSS.

CSS Versions

CSS is always evolving and has a history marked by versions. Current version is called CSS3. This course focuses on the parts of CSS that work under the CSS3 version and most recent versions before CSS3.

Your main concern with versions of CSS is its components being supported in a Web browser.

However some organizations may not update web browsers on their computers and devices. If your target audience critical to you are in those organizations, you need test your CSS for those web browser versions.

This course assumes all audiences who have current web browsers supporting CSS3. This is a reasonable assumption because security updates give a strong incentive to the public to update their web browsers.