HTML and CSS Reference
In-Depth Information
In the earlier days of the web, it was possible to use inline styles, forgoing the need for a referenced stylesheet. In
fact, you still are able to use inline styles today,
but
it's advisable that you don't.
Inline styles are those applied directly to HTML, as follows:
<body style=”color: blue; margin: 10px;”>
By applying styles in this way, you lose all the benefits previously mentioned. No longer can styles be shared across
pages, pages become more difficult to maintain, and styles can't be tailored to suit differing types of devices and en-
vironments.
Although the web has, fortunately, moved away from inline styles, e-mail hasn't. E-mails are also created using
HTML and CSS, but unlike the web, the standards and technologies haven't moved forward.
E-mail clients are in the unfortunate position of relying on old technologies with a lack of standardization, and be-
cause of that, they often don't support the CSS used in today's modern web. Therefore, if you want to create an
HTML/CSS-based e-mail, it is better to use inline styles.
User Agent Stylesheets
Before you begin applying styles to a page, it's important to understand that browsers apply their own default
stylesheet to every web page—often referred to as a
user agent stylesheet.
User agent stylesheets add default styles to HTML elements. These styles make an HTML page without any custom
CSS applied to it instantly readable. When creating a web page using these stylesheets, you don't have to apply all
the default CSS styles as defined by the CSS specification to elements yourself.
Figures 2-2 and 2-3 show the web page in Chrome and Internet Explorer 9, respectively. You may notice differences
between the two. For example, the logo in Internet Explorer 9 has a blue border around it, but in Chrome it doesn't.
The reason is that these two browsers use different user agent stylesheets. Microsoft, the vendor of Internet Explorer
9, made the decision that a linked image should have a border around it; otherwise, you have no visual indication
that it's a link. Microsoft makes a fair point; but in most cases, this border is undesirable, and furthermore, no other
modern browser does that.
