HTML and CSS are the two standards which most define the web. Taken together they tell a browser what to present, and how to present it.

Introduction

It is important to understand what each of these languages contributes to your web site, particularly because the role of HTML has changed substantially since it was first developed.

HTML provides the skeleton for a web page. It encloses the content (the part you can actually see) inside markers ('tags') which tell the browser what kind of information is being presented, and its relative importance, and how it is structured.

However, these days, it does not tell the browser how the content should be presented.

CSS, by contrast, has no function by itself. Its function is to instruct the browser how to present the content, by instructing the browser how each tag in the HTML should be represented.

While the most common presentation is visual, and on a computer screen other presentations are common. The same content, for example, needs to be presented differently to a person who is blind, or who is viewing it on a mobile phone. And it would be formatted very differently if it was being printed in a book.

CSS allows these differences to be made, while leaving the base html untouched.

In other words, by separating your content from its presentation, you can ensure that it is future-proofed, and can, in the present, be made available to your audience through a wide range of media.

HTML, short for Hypertext Markup Language, is the predominant markup language for web pages. It provides a means to describe the structure of text-based information in a document - by denoting certain text as headings, paragraphs, lists, and so on - and to supplement that text with interactive forms, embedded images, and other objects. HTML is written in the form of labels (known as tags), surrounded by angle brackets. HTML can also describe, to some degree, the appearance and semantics of a document, and can include embedded scripting language code which can affect the behavior of web browsers and other HTML processors.

In web development, Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document, including SVG and XUL.

CSS is used by both the authors and readers of web pages to define colors, fonts, layout, and other aspects of document presentation. It is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation (written in CSS). This separation can improve content accessibility, provide more flexibility and control in the specification of presentational characteristics, and reduce complexity and repetition in the structural content. CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. In this so-called cascade, priorities or weights are calculated and assigned to rules, so that the results are predictable.

-Wikipedia

A problem most people will have come across is what happens when you print a page from a website.

There is all kinds of stuff on a web site which is meaningful only with regard to finding information - the menus, for example, or to appearance - the widths of content columns, for example.

You probably do not want to print out the navigation system, and you particularly do not want the screen page to print across several sheets of paper, cutting the information you want in half vertically, or in a narrow band down the middle of the page.

What you actually want is usually for just the important information to be printed, and for it to be formatted to fill your paper. 

CSS can define different sets of styles for different media. So the pieces you don't want to print on paper can be made invisible to printers.

Example: mobile phones

Similarly, if someone wants to view your site on a mobile phone, you can organise the CSS so that the pages are displayed in a format that can be managed on a small screen - usually by presenting the material in a single column, and making invisible content which will not show on a small screen.

Just remember that if you don't specify where you want your site to be usable, the designer will probably concentrate on making it visually stunning. What you may actually need is cross-platform accessibility.