Допустимые CSS-хаки/исправления

Есть ли список «хороших» чистых CSS-хаков, которые наверняка будут надежны в будущем?Допустимые CSS-хаки/исправления

Например, zoom:1 безопасен, если он доступен только в IE, и вы помните, что он есть. Очень распространенный взлом использования дочерних селекторов - не безопасен, потому что IE7 поддерживает их. Использование height:1% просто чувствует себя грязным (но это может быть только я).

Я знаю ie7-js, поэтому ошибки IE6 меня не волнуют. Кроме того, я не ищу религиозных дебатов, просто источников.

Спасибо за ответы. Я выбрал тот, у которого есть лучшие источники в качестве ответа.

Спасибо также за предложения по использованию отдельных файлов CSS или не беспокоиться об этом. Я полностью согласен с вами, и для меня это данны. Но когда вы сталкиваетесь с проблемой компоновки, я хочу получить безопасное исправление, которое минимизирует риск того, что мне придется пересмотреть проблему в $ IE или $ FF +. К сожалению, я не делал этого более ясным.

источник

2009-02-02 Mark

Это хорошее место для хорошо задокументировано и хорошо проверенных ошибок в браузере и хаки позволяют работать вокруг них:

http://www.positioniseverything.net/

источник

2009-02-02 18:25:34

Подчеркивание-хак для IE6-материала достаточно хорошо работает, например, ,

min-height:50px; 
_height:50px;

Она не требует перемещения вещей из контекста в новых CSS-файлов, только IE6 получает их, и они легко отфильтровать, если вы должны принять решение прекратить поддержку IE6. Они также очень минимальны и не будут сильно мешать вашему CSS.

источник

2009-02-02 18:26:14 svinto

Подчеркивание префикс не является действительным CSS, поэтому никоим образом не безопасной. Используйте «* html» взломанный для IE6. – bobince

сначала следует добавить минимальные или максимальные значения, затем переопределить значения _height или _width ... это позволит вам установить min/max, а затем hardcode - значение, которое лучше всего обрабатывает минимальный/максимальный уровень IE6. – scunliffe

Для большинства ошибок IE я думаю, что вам лучше всего использовать conditional comments вокруг ссылки на конкретную таблицу стилей браузера. Это имеет тенденцию держать вещи довольно опрятными, и это вполне самодокументируется.

источник

2009-02-02 18:29:22 slashnick

Я использовал сайт «QuirksMode» Петра-Поля много для вопросов, связанных с CSS и совместимостью между браузерами. Он имеет тенденцию нахмуриться от специфичных для браузера методов, но у него есть страница на CSS Hacks.

источник

2009-02-02 18:33:22

Да, я использую его сайт религиозно, потому что лучше избегать проблем в первую очередь. Мне нравится его брать CSS-хаки особенно (странно, я никогда не читал его раньше). – Mark

Нет такой вещи, как хороший чистый/приемлемый [css] взлом - всегда код Стандартов, а затем используйте специальные таблицы стилей браузера + версии для любых хаков, необходимых для работы.

Например:
default.css
default.ie6-fix.css
default.ie7-fix.css
default.ff2-fix.css
и т.д.

Затем, когда новая версия браузера высвобождаются, скопируйте хаки для предыдущей версии и удалить биты, которые больше не применяются (и при необходимости добавьте новые биты).

(. Загрузка отдельных таблиц стилей с помощью условных комментариев для IE и агента пользователя нюхают для других браузеров)

источник

2009-02-02 18:59:30

(И хотя это не является прямым ответом на то, что было задано, я бы сказал, что это правильный ответ) –

Согласен; это приемлемый ответ, поскольку предпосылка вопроса неверно предполагает, что существуют приемлемые хаки. – jacobangel

Но вы полагаетесь на обнюхивание браузера, чтобы сделать это. – Nosredna

модифицируя CSS для поддержки конкретного обозревателя никогда не ошибается - до тех пор, как вы можете легко содержать его.Как вы заметили, совместимые со стандартами браузеры, * cough * все кроме MSIE, никогда не будет ломаться с будущими выпусками. Новые стандарты W3C также не нарушают прежние стандарты, они обычно не рекомендуют придерживаться прежних стандартов и не расширяют их.

Люди упомянули условные комментарии, которые подходят для обработки IE. Но вам понадобится немного больше для обработки всех браузеров (мобильных, gecko, webkit, opera и т. Д.). Обычно вы обрабатываете входящие заголовки запросов, чтобы выбрать тип и версию браузера из параметра User-Agent. Исходя из этого, вы можете начать загрузку файлов CSS.

Я верю, как большинство из нас делает это по:

Первой разработки для одного обозревателя, отвечающий стандартам (давайте FF, например)
После CSS завершения вы приближаетесь providig поддержки IE (это можно легко сделать с помощью условных комментариев, так как perviously упоминается)
- Сначала нужно создать CSS файл, который будет точной настройки все для IE6 и любую другую версию ниже
- Затем создайте CSS-файл, который будет обрабатывать все для IE7
- Наконец, создайте CSS файл, который будет обрабатывать все для IE версии IE8 и выше
  - Когда IE9 выходит, убедитесь, что вы установили IE8 + обработку для IE8 конкретных и создать + CSS файл IE9 с необходимыми исправлениями
Наконец, создать дополнительный файл CSS для Webkit исправлений
- при необходимости, вы можете также создать дополнительные фи ле специально предназначаться Chrome или Safari, если требуется

Что касается браузера реализации конкретных CSS, я обычно группы все из тех, кто в моем главном файле CSS (вы можете легко сделать поиск для тех, и заменить их в одном документе если нужно). Поэтому, если что-то должно быть прозрачным, я бы установил как непрозрачность, так и фильтры (MSIE) в том же блоке. Браузеры просто игнорируют реализации, которые они не поддерживают, поэтому ваш сейф. Конкретные реализации, которые я бы хотел избежать, - это пользовательские реализации (эй, мне нравится поле -moz над W3C, но я просто не хочу полагаться на него).

Как и в случае наследования и переопределения CSS, вам не нужно переопределять все объявления и определения CSS в каждом файле CSS. Каждый последовательный загруженный файл CSS должен только содержит селектор и конкретные определения, необходимые для исправления, и ничего больше.

В конце концов, в конце концов, это ваш (огромный) основной файл css и другие, содержащие по несколько строк каждый для конкретных исправлений браузера, который подводит итог тому, что не так сложно поддерживать и отслеживать , Личным предпочтением является то, какой браузер будет работать с базовым файлом css, но обычно вы будете ориентироваться на браузер, который будет создавать наименьшее количество проблем для других браузеров (так что да, разработка для IE6 будет очень плохим решением при этом точка).

Как всегда, соблюдение правильных практик и практичность и тщательность в отношении селекторов и особенности каждого класса и использование фреймворков приведет вас к пути добра с минимальными исправлениями.Структурирование ваших файлов CSS является огромным плюсом, если вы не хотите, чтобы в конечном итоге был беспорядочный бесполезный беспорядок.

источник

2009-02-02 19:30:13

Стандартные браузеры могут ломаться в будущих выпусках, когда есть ошибки или другие регрессии, особенно в малоиспользуемых функциях.Я столкнулся с этим много и очень хочу, чтобы все браузеры поддерживали условные комментарии. –

Я ограничился только разбором CSS. Вы не должны замечать разницу в рендеринге в версии выпуска FF X по сравнению с версией FF Y в отношении CSS. Насколько я знаю, W3C никогда не вводил никаких регрессий CSS, хотя я мог ошибаться. –

Nicole Sullivan (AKA Stubbornella), который работает на производительности команды Yahoo предложил в The 7 Habits for Exceptional Perf, что вы должны использовать CSS хак с подчеркиванием залатать IE6 ошибок, потому что:

Hacks должны быть мало и далеко друг от друга.
Если у вас будет только 5-6 хаков (это уже много), то не будет смысла размещать их во внешнем файле и тем самым отделять его от контекста.
Дополнительный файл приведет к штрафам за производительность (Yahoo Best Practices, Rule 1).

Следует, однако, отметить, что это неверно.

источник

2009-02-02 19:38:03 Andy

+1 справедливость является вторичной проблемой, когда последствия тривиальны - fwiw, я считаю, что деконтексты и растущие запросы нетривиальны. – annakata

При определении правил, я считаю, это хорошо, чтобы естественная деградация иметь место, например, в CSS3 есть поддержка для моделей RGBA цвета, но не в CSS2, так что я считаю себя делать:

background-color: #FF0000; 
background-color: rgba(255,0,0, 50%);

Так что, когда более позднее правило выходит из строя в старых браузерах, которые его не поддерживают, он будет деградировать до ранее определенного стиля.

источник

2009-02-02 22:09:01

Centricle имеет хороший список хакеров CSS и их совместимость.

Я не думаю, что вы найдете список хаков, которые станут будущим доказательством, поскольку знаете, что можно сказать, какая глупость будет реализована в IE.

источник

2009-02-02 22:14:24

На самом деле это стол Centricle вдохновил меня. Каждый из этих методов - это временная бомба, полагаясь на то, что * несвязанная * ошибка синтаксического анализа позволяет вам делать направленные изменения. – Mark

Я предпочитаю метод global conditional comment, описанный Hiroki Chalfant;

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

источник

2009-02-02 22:16:11

Ницца, и вполне самодокументирующийся. Тем не менее, не всегда приятно или даже практично позволять ошибкам определять макет страницы, и мне не нравится рекомендация использовать> для таргетинга на другие браузеры. – Mark

Я не позволяю ошибкам диктовать мой макет; i для стандартов и использования условных комментариев для подачи переопределений IE-версии, где IE падает на соответствие. например # someElement {someRule} ... # ie6 # someElement {someRule-overridden-for-ie-6} –

Извините, я имел в виду, что мне не нравится тот факт, что IE будет иметь другое дерево документов. – Mark

Эта статья представляет собой хорошее резюме CSS хаков: http://www.webdevout.net/css-hacks

источник

2009-12-21 00:16:20

Вот good list фильтров, которые являются очень стабильными:

/* Opera */ 
.dude:read-only { color: green; } 

/* IE6/IE7 */ 
@media, 
    { 
    .dude { color: silver;} 
    } 

/* IE8 \0 */ 
@media all\0 
    { 
    .dude { color: brown; } 
    } 

/* IE9 monochrome and \9 */ 
@media all and (monochrome: 0) 
    { 
    .dude { color: pink\9; } 
    } 

/* Webkit */ 
* > /**/ .dude, x:-webkit-any-link { color:red; } 
    /* 
    * > /**/ 
    /* hides from IE7; remove if unneeded */ 


/* Firefox */ 
@-moz-document url-prefix() 
    { 
    .dude { color: green; } 
    }

источник

2012-01-09 19:49:48

Допустимые CSS-хаки/исправления

ответ

Смежные вопросы