Adding the media query to html
Hey luckyparrot,
You point your html to all the stylesheets in the head of your html. If you've got more than one stylesheet, you'll need to create more than one link.
So let's say you've got your handy mobi stylesheet and one for everything else. You'll do one, then the other:
<head>
<style type="text/css" media="amzn-mobi" href="css/mobi.css" />
<style type="text/css" media="not amzn-mobi" href="css/standard.css" />
</head>
(where you replace the css/mobi.css and css/standard.css for the filepath to whatever and wherever you've named your files)
You can keep listing and listing and listing different queries and associated stylesheets if you wanted. Just make sure you test at every step along the way. Some devices (ahem nook) get jealous if you list someone else's stylesheet before theirs.
If you use @import or @media in your css, you shouldn't need a separate rule for everything not mobi, but if you really want to have everything in separate pretty categories, you can use not amzn-mobi to do that the same way you used amzn-mobi to target mobis.
|