Any issues with HTML5 namespaced elements (a no js solution for IE)
I recently came across this article which explains how to use HTML5 tags in IE without javascript. Basically you create a namespace globally and include it on each HTML5 tag. This way IE can recognise it and you can target it with CSS. This is the same method as used to style an XML document so if you have experience of that please comment!
In all it looks like it could be a good idea and a decent option (I'm quite happy to output XHTML) and was wondering if anyone had any experience with this and/or opinions.
My assumptions so far:
- The tags are only recognised by the browser - they do not inherit the new outlining model
- This namespacing works the same in all browsers - it is not specific to IE
The drawback I can see at the moment is it could be rather tiresome removing开发者_开发问答 the namespacing on elements if the website no longer offers support for browsers that don't support HTML5 natively. However I think this is unlikely to be an issue for quite some time now :)
Please let me know what you all think. Even better if you know any examples of this practise that I can go look at that would be awesome.
Thanks!
It seems rather pointless. The elements created are not HTML5 elements, because HTML5, served as text/html doesn't support namespacing.
So html5:section isn't an element called "section" in the namespace mapped to the "html5" prefix - it's simply an element called "html5:section". This will be in the http://www.w3.org/1999/xhtml namespace, because that's where all unrecognised elements go.
Now, IE ONLY has had for quite a long time an unstandardized pseudo namespacing mechanism as described in the article. It does indeed create an element with a name of "section" and it sets some properties to record the pseudo namespace. And IE's parser does indeed treat it as an element such that it can be styled, contain other elements etc.
However, This means that you now have mark-up that does one thing in IE and something else in HTML5 compliant browsers, and neither are resulting in the HTML5 elements that you want.
You could use the following technique to allow for both semantic container elements with no html5 functionality (section, nav, article etc) in IE AND actual supported html5 elements in all enabled browsers:
<!DOCTYPE html>
<html xmlns:html5="http://www.w3.org/1999/xhtml">
<head>
<style>
html5\:section {
color:white;
background-color:blue;
display:block;
}
html5\:nav {
color:black;
background-color:yellow;
display:block;
}
</style>
</head>
<body>
<html5:nav>
This is a navigation element
</html5:nav>
<html5:section>
This is a section
</html5:section>
<video controls>
<source src="flythrough.mp4" type='video/mp4;' />
<source src="flythrough.ogg" type='video/ogg' />
</video>
</body>
</html>
It won't validate, and the namespaced elements are only pseudo elements, but it seems like a good compromise.
加载中,请稍侯......
精彩评论