How Drupal and CSS Works?

CSS known as Cascading Style Sheets is a style sheet language that describes presentation of document written in markup language.  It is designed to style web pages written in HTML and XHTML.  Drupal’s webpages are in XHTML.

Drupal system allows theme designers to change website presentation from XHTML to CSS.  The combination of CSS within the functionality of a Content Management System brings considerable amount of flexibility in programming content submission forms.  With CSS and Drupal applications, a contributor, who is not familiar or able to understand or edit CSS or XHTML code can select the layout of an article or other page they are submitting on the fly, in the same form.  For example, a contributor, editor or author of an article or page is able to select the number of columns and whether or not the page or article will carry an image.  Such information is passed to the Drupal system, and the program logic will evaluate the information and determine, based on a certain number of combinations, how to apply classes and IDs to the HTML elements.  Then, CSS styles and position them according to the pre-defined CSS for that particular layout type. To better understand it, is to say that web pages on HTML pages holds the structure of the web page and CSS file holds the presentation elements.

Web themes were complex to write and maintain prior to CSS aggregation.  There was less control on the web content to display, however with CSS feature available on Drupal system such gave web designers more control over site. Indeed, Drupal’s built-in CSS aggregation makes styling elements and positioning easy.