Conditional Blocks

End Tag: NA
Support Key:
"Downlevel-Revealed": [2|3|3.2|4] [X1|X1.1] [IE5|M|N|O]
"Downlevel-Hidden":     [2|3|3.2|4] [X1|X1.1] [IE5|M|N|O]
 What is it?
Block Types
Syntax Details 		Example
Tips & Tricks
Browser Peculiarities
= Index DOT Html by Brian Wilson =
Main Index | Element Tree | Element Index | HTML Support History

What is it?
This is a syntax introduced in Internet Explorer 5.0 that allows content to be executed based on the browser and/or version being used, without resorting to scripting. Conditional execution is used to allow for capabilities of different browsers and browser generations without settling on a "lowest common denominator" solution. Current methods of conditional execution rely on browser "sniffing" by the web server or browser, which can take time and considerable code logic to accomplish. Browser sniffing locally using scripting is particularly troublesome, as this functionality can be turned off, and not all browsers have scripting capability to begin with.

Conditional blocks serve two purposes - to create a powerful conditional execution logic system and to provide a simple, gracefully degrading conditional logic system for browsers that do not understand this structure. Conditional syntax is currently limited to IE browser/version checking, but the syntax is extensible and more powerful constructs may be added in the future.
"Downlevel-Revealed" Conditional Block
This syntax is contained within an HTML tag structure. Browsers that do not understand the syntax will always parse the contents of the block.
Basic Syntax:
     "<![if " [space]* [expression] [space]* "]>"
     [html code]
     "<![endif]>"
"Downlevel-Hidden" Conditional Block
This syntax is contained within an HTML comment. Browsers that do not understand conditional blocks will not see any of the block content. For browsers that DO understand conditional blocks, the content will only be enabled if the expression condition matches. This ensures that browsers that does not understand the embedded syntax will ignore the block entirely. If the [expression] is evaluated as true by a browser that understands the syntax, the content will be executed.
Basic Syntax:
     "<!--[if " [space]* [expression] [space]* "]>"
     [html code]
     "<![endif]-->"
Syntax Details
[expression] = [term] ( " | " [term])*
[term] = [value] ( " & " + [value])*
[value] = ( "!" )? ( [comparison] | "true" | "false" )
[comparison] = ( "lt " | "lte " | "gt " | "gte ")? " IE " [version]?
[version] = [0-9][A-Za-z0-9.]*
The BNF syntax above basically states that one or more expression terms can be chained together, where an expression can be "true", "false", or a browser version test. Note the spaces in the literal string portions of the syntax (between the quotes.) The comparison operators should be self-explanatory, but to spell them out:
"lt" = less than
"lte" = less than or equal to
"gt" = greater than
"gte" = greater than or equal to
Example
<!--[if gte IE 4 ]>
     <div style="filter: flipv(); width: 200; height: 50">This is filtered</div>
<![endif]-->
<![if lt IE 4 ]>
    <img src="example.gif" />
<![endif]>
Tips & Tricks Browser Peculiarities
Boring Copyright Stuff...