Modernizr, html5shiv, ie7.js и CSS3 Pie. Что использовать и когда?

Я только начинаю использовать HTML5 и CSS3 в своих документах. Я понимаю, что JavaScript должен довести Internet Explorer до скорости с этими новыми тегами и стилями, но я не знаю, что использовать и когда!

Мой план состоял в том, чтобы использовать html5shiv и IE9.js, чтобы следить за тегами HTML5, а также прозрачными png (и любыми другими неприятными ошибками, которые они исправляют), но затем Модернизр и CSS3 Pie были привлечены к моему вниманию.

Мой вопрос: если я использую Modernizr, он заботится о моей потребности в html5shiv, а также IE9.js? Или я должен включать их также? Что такое перекрытие, если оно есть?

А что делает CSS3 Pie, что Modernizr или другие нет? Или наоборот?

Я ценю, что ваши ребята помогают. Дайте мне знать, что вы делаете!

Ответ 1

У меня есть большой опыт работы со всеми этими, используя их в течение нескольких лет каждый.

Modernizr

Включает функциональность HTML5shiv Также делает намного больше - если вы не используете другие функции, тогда не используйте его, он замедляет загрузку страниц, но стоит того, если вам это нужно!

HTML5shiv

Очень мало, просто исправляет элементы html5 в IE, ничего больше.

CSS3PIE

Позволяет использовать граничный радиус, градиенты и тень в старых версиях IE. Также может разрешить PNG в IE 6. Добавляет заметную задержку для загрузки страницы.

ie7.js(и ie9.js)

Дает вам множество селекторов CSS3, минимальную и максимальную ширину, несколько классов и фиксированное позиционирование. Также, если хотите, может быть исправлено png. Похоже, что это не мешает.

Заключение

Мой совет разделился на две категории:

Если вы просто используете новые (два года в Интернете!) элементы и селектора CSS3, используйте ie9.js + html5shiv. Это легкий и просто позволяет вам заниматься вещами, не забывая, что IE6 ничего не поддерживает.

Если вы используете много вещей CSS3, тогда CSS3PIE будет сортировать граничный радиус и коробку-тень. Поддержка градиента кажется немного шелушащейся, поэтому я всегда использовал резервное изображение. Modernizr позволяет вам легко предоставлять различные свойства браузерам с различной поддержкой. В основном я использовал это для определения того, имеет ли браузер переходы и преобразования CSS, поскольку они полезны для любых слайдеров изображений или контентных каруселей. Стоит использовать инструмент настройки, чтобы включать только те функции, которые вы хотите - материал webforms показывает текстовое поле с 50 в нем в течение нескольких миллисекунд, поэтому стоит отключить, если вы этого не хотите.

Надеюсь, что это полезно!

Ответ 2

Я бы рекомендовал вам использовать только то, что вам нужно. Создайте приложение в браузере, который поддерживает функции, которые вы используете, и периодически проверяйте в других поддерживаемых браузерах. Если что-то не работает правильно, найдите соответствующее исправление, будь то html5shiv, IE9.js, Modernizr или CSS3 Pie. Вы не собираетесь использовать все новые функции в HTML5 и CSS3 на одной странице, поэтому вам не нужно включать в себя каждую библиотеку polyfill. Подождите, пока не найдете проблемы с функциями, которые вы пытаетесь использовать, затем попробуйте найти библиотеку, необходимую для этого.

Ответ 3

Я использовал в основном CSS3Pie... он отлично работает. Но сегодня днем я тестировал его на своем ноутбуке с I.E8, и с ним возникла проблема... он отключил некоторые строки css... когда я удалил код css3pie, мой сайт получил удвоенную скорость... тогда я пришел через столбики с людьми, спорящими о замедлении css3... Итак, в настоящий момент я занят поиском другого способа для IE7 и IE8 иметь пограничный радиус и оттенки.

Если вы хотите использовать его... пожалуйста, проконсультируйтесь, так как это НЕ-официальные исправления.