Introductory tutorial to CSS styles.

CSS Overview.

The sign CSS stands for Cascading Style Sheets. It is a formatting language for web pages, but also for other documents such as XML documents. CSS is perfectly standardized by the W3C, and is now supported virtually 100% by all browsers.

CSS responds to several problems:

  • It separates the content itself from its formatting.

    The need to produce increasingly aesthetically rich web pages risked leading to the absurdity of having more code to ensure the layout as well as to describe the content itself. The volume of pages would be increased by the same amount.

    CSS allows all formatting directives to be saved in a separate file, which will be simply associated with the content pages.

  • CSS makes it easy to homogenize the presentations of a website.

    Since the formatting is described in a separate file, it is easy to associate that same file to all the pages of the site and thus, to give them all the same presentation.

    Formatting changes will also be much faster to make since it will be enough to modify a single file, without touching the many pages of the site.

  • Simplification of programs for dynamic sites.

    Generating pages dynamically (by a PHP program, by ASP, or other) is much simpler since only the content needs to be generated, without the need to take care of its formatting.

CSS designers wanted a language that was simple to implement: all you need is a notepad or any tool that can input text to create a CSS stylesheet. The syntax, although quite strict, as in any computer language, is easy to assimilate.

Over time, and over the course of the versions, CSS has gained in power and now allows very different formatting sophisticated. It provides simple solutions to new problems:

  • Responsive formatting.

    The ability to design formatting that adapts to the size of the user's screen has become particularly necessary because of mobile devices (phones, tablets, even watches).

  • Safe fonts.

    The management of fonts and their possible download to the user's machine ensures a faithful reproduction of the layout, even with fancy fonts.

  • Animations.

    CSS allows you to create animations to make websites more interactive and fun.

  • Geometric deformations.

    Geometric distortions such as rotation, can be applied to an image, title, a menu, or any element on the page.