Cascading Style Sheets

Cascading Style Sheets

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

Overview

CSS is designed to enable the separation of presentation and content, including layout, colors, and fonts. This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple web pages to share formatting by specifying the relevant CSS in a separate .css file, and reduce complexity and repetition in the structural content.

History

CSS was first proposed by Håkon Wium Lie on October 10, 1994. At the time, web documents were styled exclusively with HTML, which was increasingly being used to create both the structure and the look of pages. The development of CSS was initiated to allow web developers to create a consistent look across multiple pages of a website without having to repeat HTML markup for layout styles in each page.

Syntax

The syntax of CSS is relatively simple, consisting of selector and declaration blocks. A selector points to the HTML element you want to style, while the declaration block contains one or more declarations separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon.

Selectors

Selectors are the part of CSS code that determines which HTML elements the CSS rules will apply to. There are several types of selectors in CSS, including element selectors, id selectors, class selectors, attribute selectors, and pseudo-class selectors.

Properties

CSS properties are the actual elements that are to be changed in the document's style. Examples include 'color', 'font-family', 'margin', 'border', and 'background'. Each property has a set of possible values, which can be fixed values, like "red" or "bold", or relative values, like "20%" or "inherit".

Inheritance and the Cascade

One of the key features of CSS is its cascade rule, which controls how to resolve conflicts when multiple rules apply to the same element. CSS also supports inheritance, which means that styles can be passed from a parent element to its children.

Media Queries

Media queries allow the page to use different CSS style rules based on characteristics of the device the site is being displayed on, most commonly the width of the browser.

Frameworks and Preprocessors

To facilitate more dynamic and powerful styling, CSS frameworks and preprocessors have been developed. Frameworks like Bootstrap provide a collection of CSS (and sometimes JavaScript) files that you can include in your project to use their ready-made components. Preprocessors like Sass and LESS allow developers to write CSS in a programming construct, which then compiles into standard CSS.

Future Developments

The CSS specification is maintained by the World Wide Web Consortium (W3C). New features and improvements are continuously being worked on, including variables (custom properties), grid layout, and flexbox.

See Also

• HTML
• JavaScript
• Web design