HTML5/">The era of HTML5 is popular has arrived. If you are still waiting for browser compatibility, it means you are out of touch with the web. Of course, this is due to the booming development of mobile clients. If you are still struggling with whether you should master html5 and css3 technologies, please slap yourself a few times, and then learn hard! Because the spring on the front end has arrived, and more than one spring. If you Не верьте этому, я могу только сказать: поверьте, хотите нет!
Давайте посмотрим на стандартную структуру тегов HTML5: (я просто говорю здесь о тегах, и больше ничего не вовлечено)
<! Doctype html>
<html>
<голова>
<meta charset = "gb2312">
<title> html5 </title>
</head>
<тело>
<заголовок>
<Av> </nav>
</header>
<статья>
<раздел>
<h2> </h2>
<p> </p>
</section>
</article>
<нижний колонтитул> </нижний колонтитул>
</body>
</html>
Содействие тегу HTML5, конечно, потому что его семантика более интуитивно понятна. Конечно, это только один из кончиков прогресса HTML5. Некоторые люди предполагают, что: не говорите, что прогресс HTML5 является революционным, но развитием! Я не возражаю против этого утверждения, но в некоторых отношениях это действительно революционно. Я не хочу выходить за рамки темы здесь, мы говорим только о лейблах.
Конечно, когда я взволнован такой замечательной семантической тегом, мне не только нужно спросить: IE поддерживает ли это? К сожалению, ответ - нет. Если вы уже напуганы IE, вы должны продолжать терпеть его бесконечные пытки. (IE9 и IE10 уже совместимы и поддерживают HTML5 и CSS3/"> CSS3.0)
Но вы должны быть рады, что в эту эпоху есть много гений, в которых вы живете. Кто -то помог вам решить эту проблему! Хотя это нельзя назвать идеальным!
Давайте посмотрим на несколько решений, чтобы решить проблему не поддержки тегов HTML5, которые совместимы с IE6/7/8:
1. javascript: document.createElenment (......) Одна из причин, по которой IE6/7/8 не поддерживается, заключается в том, что они не считают нижний колонтитул действительным HTML -тегом. Итак, разве мы не сделаем это лейблом? Самым прямым способом является создание JavaScript: Document.CreateElenment (......)!(function () {
var element = ['header', 'looter', 'article', 'в сторону', 'section', 'vav', 'menu', 'hgroup', 'details', 'dialog', 'figure', 'figcaption'],
len = element.length;
while (len-) {
document.createElement (элемент [i])
}
}) ();
Это просто создает несколько типичных тегов HTML5, чтобы они могли стать тегами в IE6/7/8.
Кто -то написал полный файл JS, вам просто нужно представить его, например:
<!-[если я т.е. 9]>>
<script src = http: //html5shim.googlecode.com/svn/trunk/html5.js> </script>
<! [endif]-> есть также пишут
<!-[если я т.е. 9]>>
<script src = http: //html5shiv.googlecode.com/svn/trunk/html5.js> </script>
<! [endif]-> Единственная разница между HTML5Shiv и HTML5Shim-это m и v, и нет другой разницы! Конечно, это не то, что я сказал. Оригинальный текст: ... единственное отличие в том, что у человека есть M и один есть AV - вот и все.
Здесь мы хотим сделать особую примечание: то есть, то есть уникальное суждение аннотации:
LTE: это аббревиатура меньше, чем или равна, что означает меньше или равную.
LT: это аббревиатура меньше, чем означает меньше, чем.
GTE: это аббревиатура больше или равна, что означает больше или равного.
GT: это аббревиатура больше, чем, что означает больше, чем.
! : Это означает не равное, так же, как и неравственный символ суждения в JavaScript
Хотя IE9 поддерживает теги HTML5, поддержка не очень полна, поэтому вы также можете написать LTE, что зависит от вашего выбора!
Конечно, не забудьте указать свойство дисплея недавно созданного тега. В большинстве случаев я хочу, чтобы тег был заблокирован:
Заголовок, нижний колонтитул, статья, в сторону, раздел, навигация, меню, hgroup, детали, диалог, рисунок, Figcaption {Display: Block}
2. Методы гнездования метокНа самом деле, чтобы выразить это, это связано с тем, что семантические теги HTML5 Nest Divs и другие доступные теги, а затем только стили записи для DOV. Я не согласен с этим методом письма. Это лучше, чем сделать это, дайте тегу семантическое идентификатор или класс!
<!-[если я т.е. 9]>>
<style>
тело> *.
Цвет: #ff0;
}
</style>
<! [endif]->
<style>
раздел. Раздел {Цвет: #F00;
}
</style>
<section> <div> тест контента ... </div> </section>
Но если она похожа на эту структуру, ее небезопасно в использовании :<av>
<ul>
<li> </li>
<li> </li>
<li> </li>
</ul>
</nav>
3. т.е. условные комментарии<!-[если LT IE 9]> <div> <! [endif]->
<!-[IE IE 9]> <section> <! [endif]->
<!-[if! IE]> <!-> <section> <!-<! [endif]->
......
<!-[если LT IE 9]> </div> <! [endif]->
<!-[IE IE 9]> </section> <! [endif]->
<!-[if! IE]> <!-> </section> <!-<! [endif]->
Посмотрите на уникальное решение IE снова:
LTE: это аббревиатура меньше, чем или равна, что означает меньше или равную.
LT: это аббревиатура меньше, чем означает меньше, чем.
GTE: это аббревиатура больше или равна, что означает больше или равного.
GT: это аббревиатура больше, чем, что означает больше, чем.
! : Это означает не равное, так же, как и неравственный символ суждения в JavaScript
Я верю, что все понимают, что происходит! Это более болезненный способ! Большое количество кода HTML делает код, который изначально хотел быть семантизированным еще более запутанным. И это не способствует написанию стилей.
4. Используйте XMLN, чтобы определить жизненное пространство документаXMLNS является аббревиатурой пространства имен XHTML, которое является так называемым пространством имен. Как и декларация Doctype, XMLNS также является декларацией. В отличие от декларации Doctype все еще существует в документах HTML, XMLNS не существует в документах HTML. XMLN, которые мы обычно видим, появляются в документах XHTML.
<html xmlns = http: //www.w3.org/1999/xhtml lang = en> Это исходное пространство имен xhtml, которое было упрощено после HTML5.
<html lang = en> метод из журналов Elco Klingen привлекал широкое внимание в начале. Этот метод содержит пространство имен XML и использует элементы с префиксом пространства имен, например:
<! Doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml" xmlns: html5 = "http://www.w3.org/html5/">
<тело>
<html5: раздел>
<!-Контент->
</html5: раздел>
</body>
</html>
Префикс: html5 не является стандартным способом написания, вы также можете использовать другие символы: HL5 также в порядке. С префиксом IE распознает новые элементы, позволяя применять стили. Это работает так же хорошо в других браузерах, поэтому в конце концов вы успешно создаете одни и те же элементы и один и тот же стиль в каждом браузере.
Этот метод имеет четкий недостаток: вы должны использовать пространство имен XML в документах HTML, и вам также необходимо сделать это в CSS:
html5/: раздел {
дисплей: блок;
}
Так как же совместимость с JS? Вот тест Deml
<! Doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml" xmlns: html5 = "http://www.w3.org/html5/">
<голова>
<title>; html5 </title>
<meta charset = "gb2312">
<style>
html5/: section {display: block; Ширина: 100px; Высота: 50px; Фон:#F00; Граница: 1px твердый синий; Цвет: #ff0; }
</style>
<Скрипт>
window.onload = function () {
Alert (document.getElementById ("test"). InnerHtml + "--- ID")
Alert (document.getElementsbytagname ("section") [0] .innerhtml + "--- Tagname")
Alert (document.getElementsbytagname ("section") [0] .innerhtml + "--- Верхив")
}
</script>
</head>
<тело>
<html5: section id = "test"> content </html5: раздел>
</body>
</html>
Результаты испытаний были проверены с помощью IE6/7/8, но только идентификаторы могут быть получены в FixFox и Chrome, поэтому этот метод не является приемлемым методом!