Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

(Nora) #1

Lesson 2: Understanding selectors, specificity, and cascading CHAPTER 4 159


Understanding the browser’s built-in styles


Even if you don’t define any styles for your HTML documents, at least one style sheet will be
used to calculate the effective style for the elements within the document. Each browser has
a built-in default style sheet, which is applied to all HTML documents before any other style
sheets are applied.
You cannot access the browser’s style sheet directly, and be aware that there can be differ-
ences among browsers.

Extending browser styles with user styles


You can extend the browser’s styles by adding a user-defined style sheet to the browser.
This is done differently based on the browser. To add a user-defined style sheet in Internet
Explorer, navigate to Tools | Internet Options | General | Accessibility. The Accessibility window
is displayed, as shown in Figure 4-6.

FIGURE 4-6 he user style sheet if set to the myUser.css fileT

User styles are applicable only to that browser on that computer, so if you launch a differ-
ent browser on the same computer, your user-defined style sheet won’t work. In addition, if
you run the same browser on a different computer, your user-defined style sheet won’t work.

Working with important styles


When you add styles to a user-defined style sheet, the styles typically don’t work because the
user-defined styles are read, and then the HTML document’s styles are read. If the browser
has a style rule setting from the user-defined style sheet, and then the HTML document’s
style sheet reads a different style rule setting, the user-defined style is overridden by the
HTML document’s style sheet. In the example, the problem is that the user might have dif-
ficulty reading webpage text and want to increase the font size on all webpages.
Free download pdf