Экспериментальный CSS для IE: взломать или не взломать?

Question

Есть несколько экспериментальных CSS, таких как border-radius (закругленные углы) и градиенты, которые я хочу использовать на своей странице. К сожалению, Internet Explorer пока не поддерживает ничего из этого. По крайней мере, в IE9 появится border-radius, пока нет слов о градиентах.

Итак, вы бы порекомендовали оставить IE в покое (большинство моих пользователей в любом случае будут работать на FF или Chrome) или использовать изображения, чтобы «исправить» презентацию для IE? Это даже стоит того? Потому что я знаю, что это не только боль в задней части, но также может нарушить стилизацию в других браузерах.

Так взломать или не взломать?

Answer 1

Я не думаю, что это когда-либо выбор между «взломом» и его реализацией вообще во всех браузерах, и я удивлен, что никто не упомянул одну из реальных «спасающих жизнь» «функций» (я не буду рассматриватьэто хак, поскольку это замечательный метод обратной совместимости): Условные комментарии

Это не только помогает справляться с раздражающими ошибками IE, но и позволяет определять менее желательные, но все же100% допустимые методы для работы определенных эффектов, таких как градиенты изображений с repeat-y вместо CSS3-градиентов, или мозаичные полупрозрачные png для IE7 и 8. Действительно, если вы хотите, IE не должен быть один единственный фактор , который ограничит вашу способность экспериментировать с CSS3.

Answer 2

Терминологический спор: использование изображений для имитации функций CSS3 в IE на самом деле не является взломом. Любой визуальный эффект, который не поддерживается напрямую в CSS, необходимо будет реализовать в изображениях.

Но чтобы ответить на ваш вопрос, это зависит:

• Если мало кто из вашей аудитории использует IE, вы можете игнорировать его. Выяснить, как мало - достаточно мало, зависит от вас / владельцев сайта.

• Если нет:

  • Если эффекты border-radius не являются ключевой частью брендинга сайта, я бы посоветовал вам просто позволить IE игнорировать их и использовать квадратные углы. Никто не просматривает веб-страницы одновременно двумя браузерами, и никого не волнует, выглядит ли ваш сайт немного по-другому в IE 6, если кнопки находятся в одном месте и все работает.

  • Если они являются ключевой частью брендинга сайта, или ваш клиент настаивает на том, чтобы сайт выглядел одинаково в IE 6, то вам нужно добиться такого же стиля в IE 6. Итак, либо:

    • используйте border-radius и условные комментарии , чтобы включить таблицу стилей для IE 8 и ниже с кодом для имитации функций

    • не беспокойтесь о border-radius - используйте код, который работает в IE для всех браузеров. Это избавит вас от необходимости поддерживать два набора кода, но это будет означать, что все браузеры должны загружать изображения, которые вы используете для IE, таким образом заставляя их работать немного хуже.

Answer 3

Хотя этот вопрос немного субъективен, мой ответ был бы не взломать. CSS3 был создан для обратной совместимости, и это означает, что он будет изящно ухудшаться, если браузер не поддерживает его. Это для меня так и должно быть. Я имею в виду, зачем использовать CSS3, если вы все равно планируете взломать его? В этом случае просто используйте простые старые приемы CSS2, такие как закругленные углы javascript или изображения, чтобы вам не пришлось взламывать по сути.

Answer 4

если вам не нужны изображения, взломы IE или отдельная таблица стилей, вы всегда можете проверить CSS3Pie: http://css3pie.com/. Это не идеально, особенно если вам нужны градиенты и тени, но они могут работать с закругленными углами довольно без труда. Существуют похожие варианты поведения IE, но я думаю, что сейчас это наиболее активно развивается.

Answer 5

Это действительно зависит от того, насколько важны эти функции для внешнего вида сайта, или, скорее, от того, насколько важными для них являются клиент и команда дизайнеров.Кроме того, это вопрос о том, сколько это будет раздувать вашу разметку и CSS - т.е.в зависимости от того, как эффекты должны быть построены в контексте проекта, сколько хлопот это будет иметь?придумать что-то подходящее, но это не должно быть 1 к 1 для композитного искусства.Опять же, это решение, которое вы, как разработчик, сможете принять самостоятельно (ну, если вы не дизайнер).

Answer 6

Есть хаки, а затем есть хаки.Я интерпретирую «взлом» как нечто, использующее уязвимость в браузере, например, взлом селектора потомков в IE (с использованием >).Такие вещи ломаются при обновлении браузера.

Я не считаю использование изображений для создания хороших теней или градиентов хакингом.Это может не соответствовать требованиям, что вы делаете все семантически, и вы можете испытывать тошноту, прибегая к использованию изображения для чего-то, для чего изображение не требуется, но реальность такова, что просто нет выбора - нет способа сделать всечистый способ без изображений - если вам нужны красивые градиенты и тени в большинстве браузеров пользователей (в большинстве случаев это Internet Explorer).

Если вы считаете, что скругленные границы или градиенты являются просто опциейтогда, конечно, не беспокойтесь о IE.Но если вы считаете, что это на самом деле делает ваш дизайн хорошо выглядящим, и вы не хотите, чтобы большинство ваших пользователей * упускали его, тогда сделайте это.

* В зависимости от вашей аудитории, IE может или не можетЯ не думаю, что они составляют большинство вашей аудитории.