Comments: HTML5 provides developers with many new labels, such as section, nav, article, header, and footer. these tags are frequently used because of their high degree of semantics. However, in old browsers such as IE6, IE7, IE8, and Firefox 2, they cannot be identified and used normally, next we will introduce how to eliminate this anger.
HTML5 provides developers with many new labels, such as section, nav, article, header, and footer. these labels are highly semantic and often used. However, they cannot be recognized and used properly in old browsers such as IE6, IE7, IE8, and Firefox 2.
Why can't old browsers recognize these labels?In fact, the error is not in the browser, because this tag does not exist in that era, so it cannot be identified correctly, and this unusual tag recognition makes the DOM structure abnormal.
The test code is as follows: it is the title of an article and the content of a blue text article. The article content uses the article tag.
The Code is as follows:
<! DOCTYPE html>
<Html xmlns = "http://www.w3.org/1999/xhtml" lang = "zh-CN">
<Head>
<Meta charset = "UTF-8"/>
<Title> test </title>
<Style>
Article {color: # 06F ;}
</Style>
</Head>
<Body>
<H1> Article Title <Article>
This is the content of the article. It should be a piece of blue text. In older browsers, if you do not use hack, an exception is displayed.
</Article>
</Body>
</Html>
In IE8, the following is displayed.
IE8 does not recognize the article label. The CSS style defined on the label does not work. In IE8,<article>Interpreted as "name"<article />And</article />Two empty tag elements, and the content of the article, are listed as sibling nodes, such.
Since tags cannot be identified and cannot be used, the solution is to identify tags. Fortunatelydocument.createElement(tagName)This allows the browser to identify the tag and the CSS engine to know the existence of the tag.Add the following code to the region.
The Code is as follows:
<Script>
Document. createElement ('Article ');
</Script>
The DOM interpretation in IE8 is shown in.
Naturally, the text is displayed in normal blue.
Conclusion The blog has been switched to HTML5 for a long time, but many users are still using HTML 4 label sets without using the latest browsers. many HTML5 labels are highly semantic and practical. I also started to try some commonly used labels. Now I use the article and time labels.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
