CSS - Cascading Style Sheets
CSS utilizes rules to provide a web page with design and layout information. The rules provided in the CSS document can be applied to different types of media including desktop display, mobile viewing or printed material. CSS is added to a web page along with HTML and applied when a browser displays the web page to a user. CSS rules utilize inheritance to apply rules to many elements or specific sub elements within a given element.
CSS Design Rules
The design of a web page or entire website can be controlled by one or more CSS documents. Rules can be applied to HTML elements with a class or element ID. By referencing the HTML element, rules for formatting, including color, size and spacing can be applied. Examples of design rules include display information for headers, paragraphs and images. Padding and margin can be applied to elements to provide spacing between web page elements. Formatting rules can change the way that text, links and headings are colored, sized or rendered.
CSS Layout Rules
CSS can also provide information on how a web page or website layout. Layout rules detail position and order of HTML elements. Common layout rules for position include absolute, relative and fixed. By combining layout rules, a web page layout can be made to adapt to any screen size. This type of design is called a liquid design.
CSS Media Queries
Media rules or media queries can tell a web page how to change the way it is displayed based on the device it is viewed on. Desktop display may include rules for large screens and mouse based interactions. Mobile CSS rules often modify the design and layout of HTML elements on to fit a smaller screen and provide better interaction with touch devices. Additional media rules can be provided for printable web pages. Print rules may hide or show specific elements to provide users with a printable format. CSS can include many media queries with different design and layout rules to provide the best experience regardless of display.