What is CSS?
CSS complements HTML by providing a look and feel to web pages. The
HTML pages you created in the preceding chapter looked fairly plain, with
a default font and font size. Using CSS, you can spice up that look, adding
color and background images, changing fonts and font sizes, drawing
borders around areas, and even changing the layout of the page itself.

CSS has its own language, separate from HTML, but you wouldn’t use CSS
without the HTML page. In other words, although HTML can stand on its
own and present a page to a browser, CSS can’t. You wouldn’t write a CSS
page. Rather, you write HTML and then use CSS to help style that page to get
it to look like you want it to.

Why use CSS?
Before CSS, an HTML developer changed fonts and colors by changing
attributes on each element. If the developer wanted all the headings to look
a certain way, he had to change each of those headings. Imagine doing this
on a page with ten headings, and then imagine doing it on 50 pages. The task
quickly becomes tedious. And then think of what happens when the site
owner decides she wants all the headings changed back to the original way.
CSS alleviates this burden of individually updating elements and makes it so
that you can apply one single style across one or more elements. You can
apply multiple styles to the same element, and you can target a certain style
down to the individual element. For example, if you want all headings to be
bold font but a certain heading should have italic, you can do that with CSS.
Use CSS to make changes to the layout, look, and feel of a web page. CSS
makes managing these changes easy.

Limitations of CSS
CSS isn’t without limitations. The primary limitation of CSS is that not all web
browsers support CSS in exactly the same way. One browser might interpret
your layout in a slightly different manner, placing items higher or lower or in
a different place entirely.
Also, older browsers don’t support newer versions of CSS, specifically the
CSS3 specification. This means that those browsers can’t use some of the
features of the CSS3 specification. To get around this, you can use older
versions of the specification that are more widely supported by those older
browsers.
The key when using CSS and, as you see later, when using JavaScript, is to
test across multiple browsers. Web browsers such as Firefox, Chrome, and
Safari are all free downloads, and Microsoft offers software called the Virtual
PC for Application Compatibility, which are free, time-limited, versions of
Windows that include older versions of Internet Explorer. You can run them
inside of Microsoft’s free Virtual PC emulation software. By testing in other
browsers, you can see how the site will look in those browsers and correct
layout issues prior to deploying the site to the Internet.

Adding styling to an HTML element
You add style to just about any HTML element with the style attribute, as in
this example that makes all the text in the first paragraph into bold font:
<p style=”font-weight: bold;”>All of this text will be
bold.</p>