• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

11. Managing Style Sheets > 11.5. Importing Browser- or Operating System-Specif...

Importing Browser- or Operating System-Specific Style Sheets

NN 4, IE 4

Problem

You want to load separate external style sheet files for users on different kinds of computers.

Solution

Use JavaScript to write <link> tags within the head portion of the page, branching according to operating-system detection. The following example loads different style sheet files for Mac users and all other users:

<head>
...
<script language="JavaScript" type="text/javascript">
var cssFile = (navigator.userAgent.indexOf("Mac") != -1) ? 
    "styles/macCSS.css" : "styles/pcCSS.css";
document.write("<link rel='stylesheet' type='text/css' href='" + cssFile + "'>");
</script>
...
</head>

You can combine the browser- or operating system-specific external style sheets with other fixed <link> elements in the same page, as well as other kinds of style sheet definitions or @import rules (where supported). If your content observes the strict version of XHTML, and you want dynamically generated code to also be in that form, you can use the following document.write( ) call instead:


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint