<!--[if IE]>This is the notification result, according to the browser you're using right now :
This is the notification for all IE users<![endif]-->
<!--[if IE 6]>
This is the notification for IE 6 users<![endif]-->
<!--[if IE 7]>
This is the notification for IE 7 users<![endif]-->
<!--[if IE 8]>
This is the notification for IE 8 users<![endif]-->
<!--[if IE 9]>
This is the notification for IE 9 users<![endif]-->
<!--[if gte IE 8]>
This is the notification for users using IE 8 or higher<![endif]-->
<!--[if lt IE 9]>
This is the notification for users using lower than IE 9<![endif]-->
<!--[if lte IE 7]>
This is the notification for users using lower than or equal to IE 6<![endif]-->
<!--[if gt IE 6]>
This is the notification for users using greater than IE 6<![endif]-->
<!--[if !IE]> -->
This is the notification for non IE users<!-- <![endif]-->
This is the notification for non IE users
AbbreviationsYou can use those "if"s to wrap the internal <style> or external CSS link.
lt : less than
gt : greater than
lte : less than or equal to
gte : greater than or equal to
So, try it out. BTW, you don't have to use all the codes there, just pick one or two that suits your design need.
To make the notification popped out, you can create a box with CSS (limit it to CSS level 2) to wrap the text, then place it on the top section of your blog. For instance :
<div style="background:red; width:300px; color:yellow; font-weight:bold; padding:10px; margin:auto; text-align:center;">Then, change the sentence inside that conditional IE "if" to your own words, or put a picture over it, or even create another CSS styling. The element wrapped within the IE HTML comment will be shown/hide depends on which comment you use. For the example above, the notification word for IE users will be shown to IE users, and not to non-IE users, back and forth. You can also wrap your entire HTML <body> section with it. BUT, not recommended. I suggest to use it for wrapping particular-specialized styling and script element, like example below.
<!--[if !IE]> --></div>
This is the notification for non IE users
<!-- <![endif]-->
<!--[if IE]>
This is the notification for all IE users
<![endif]-->
Using it for styling and script, external and internal
You can use it to control the appearance of certain CSS or the execution of a particular script, such as :
<!--[if IE]><!--external stylesheet--><![endif]-->
<link href='your-external-CSS-for-IE9-' rel='stylesheet' />
<style>
/*--your CSS for IE9- users--*/
</style>
<!--external JavaScript-->
<script src='your-external-script-for-IE9-' />
<script>
// your JavaScript
</script>
That's about it. I hope this could be useful of some sort.
Further reading resources : Quirksmode and CSS-Tricks
No comments:
Post a Comment
Tell me what you think...