Applying different Cascade Style Sheets to the same html page

Question

To apply a CSS to an existing html page I need to add a link that links to the css file, I am asked to include a link in the webpage that I am building that would link to the same html page but with a different css file, I am thinking I need to create a different css file, then create another .html page by copy the exact content from the first page and only change the link of the css file, but it doesn't seem so efficient and I am assuming there should be a standard method to do this.

thanks

Answer 1

you can use a JAVAscript to documet.write a link

Answer 2

If you can use a server-side language like PHP, I would do it something like this:

<?php

   $allowed_stylesheets = array("red", "white", "blue", "green", "mobile");
   $default_stylesheet = "red";

   $stylesheet = 
   (in_array($_GET["stylesheet"]) ? $_GET["stylesheet"] : $default_stylesheet);

?>

<link rel="stylesheet" type="text/css" href="<?php echo $stylesheet; ?>">

you would then be able to call your page, and switch the style sheet like so:

www.example.com/page.php?stylesheet=mobile

note that to make a .html page run in PHP, there is probably some server setup necessary, by default only .php pages are parsed in PHP. Depending on your situation, that may be too much hassle than it's worth. However, I don't know any pure HTML way of switching style sheets reliably.

Also, this way, you will have to repeat the style sheet command every time you call the page.