What is CSS?
Ever wonder how web pages have a specific look and feel with color, fonts, and layout? These features are part of the Cascading Stylesheet (CSS) language. It provides for the separation of the data in HTML from the styling of the data. Thus, developers can define the look of a webpage separately from the text it contains.
There are three ways to write CSS:
- Inline CSS: HTML element is styled;
- Embedded CSS: CSS rules are located in an HTML file; and
- External CSS: CSS is located in an external file. This makes the CSS code easy to maintain and reusable.
We'll look at each type in the following sections.
What is CSS for?
As we have mentioned before, CSS is a language for specifying how documents are presented to users – how they are styled, laid out, etc.
A document is usually a text file structured using a markup language – HTML is the most common markup language, but you may also come across other markup languages such as SVG or XML.
Presenting a document to a user means converting it into a form usable by your audience. Browsers, like Firefox, Chrome, or Edge, are designed to present documents visually, for example, on a computer screen, projector or printer.
Note: A browser is sometimes called a user agent, which basically means a computer program that represents a person inside a computer system. Browsers are the main type of user agent we think of when talking about CSS, however, it is not the only one. There are other user agents available – such as those which convert HTML and CSS documents into PDFs to be printed.
CSS can be used for very basic document text styling – for example changing the color and size of headings and links. It can be used to create layout – for example turning a single column of text into a layout with a main content area and a sidebar for related information. It can even be used for effects such as animation. Have a look at the links in this paragraph for specific examples.