Кроссбраузерность. Альтернативные варианты

[vla]

Альтернативная верстка для разных браузеров​

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

Как я понимаю, можно пресечь в корне - сгенерировать код для конкретного браузера на PHP. Также можно воспользоваться условными комментариями в CSS и HTML.

Что я хочу попросить:
1. Приведите простые примеры решения на PHP, CSS, HTML, JS
2. Ссылки, на достойные статьи
3. Можно спросить у браузера - поддерживает он конкретное свойство CSS или нет и в зависимости от этого сверстать страницу? Если да, то на чем?
4. Советы из вашего личного опыта

I Love IE5!​

 

[medwoodu]

1,2 google "css hack"
3 НЕТ
4 Не парится а погуглить, сейчас все это облегчается с унификацией браузеров

 

[vla]

[member=Medwoodu], согласен, уже что-то нашел.
Только сомневаюсь на счет третьего пункта. Неужели так катастрофически "НЕТ"? Если это так, то печально... Но, по моему, я встречал что-то подобное, когда читал про JS. Там такие слова были: "браузер лучше программиста знает что он поддерживает"... Мне кажется, что с помощью JavaScript можно определить поддержку свойсва CSS...
Если найду - кину ссылку! Но возможно вы правы - "нет".....

 

[tigra60]

"браузер лучше программиста знает что он поддерживает"

Да! Это действительно так. Только, он, зараза, держит это, по большей части, в секрете.

Посмотрите, хотя бы, как кроссбраузерно создается объект запроса для Ajax:

Бумц головой в стенку - вот, блин, кирпич. Устояла.
Бумц в другую - урааааа! Гипсокартон! Проломил!!!!

Так мы и в CSS точно так же делаем:

.box {
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-o-border-radius:5px;
-ms-border-radius:5px;
}

Что-нибудь, да сработает, может быть... потом... частично...

 

[lekzd]

Так мы и в CSS точно так же делаем:

.box { border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px; -ms-border-radius:5px; }

Что-нибудь, да сработает, может быть... потом... частично...

Не правильно, вы, Тигра, делаете, свойство без префиксов должно быть строго конце, ибо оно 100% следует стандарту w3c (конечно с border-radius все выполняется по стандарту, но есть свойства-исключения)

 

[BaNru]

lekzd, впервые такое слышу. Пруфлинк пжл.
И как тогда быть с градиентами?

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

По всем пунктам ТС сразу:
- На PHP и JS смотрим юзер агент и выдаем соответственные стили. Не оправданный способ, ибо стоимость разработки возрастает в разы, т.к. много разных файлов писать. Используется в google... Хотя там не только стили, но я вся верстка подрубается соответственно для старых ишаков и не известных браузеров. На этом форуме скрипты действуют аналогично. Можно проверить - сменив юзерагент в браузере.
- Условные комментарии в HTML при подключение стилей для ишака. Самый оптимальный, но я его не юзаю
- Я же использую непосредственно хаки в CSS для осла. Невалидный CSS, но проще в разработке. Да и валидный CSS сейчас найти практически не реально из-за тех же префиксов. Делаю хаки в самый последний момент. Обычно хватает 2-3 строчки теста.

 

[medwoodu]

[member=Medwoodu], согласен, уже что-то нашел.
Только сомневаюсь на счет третьего пункта. Неужели так катастрофически "НЕТ"? Если это так, то печально... Но, по моему, я встречал что-то подобное, когда читал про JS. Там такие слова были: "браузер лучше программиста знает что он поддерживает"... Мне кажется, что с помощью JavaScript можно определить поддержку свойсва CSS...
Если найду - кину ссылку! Но возможно вы правы - "нет".....

http://htmlbook.ru

вот кстати может вас заинтересует:
http://twitter.github.com/bootstrap/

 

[lekzd]

lekzd, впервые такое слышу. Пруфлинк пжл. И как тогда быть с градиентами?

Какая-то конференция веб-разработчиков, про css там помню говорил один из разрабов оперы, находил недели 2 назад на хабре

 

[blackcot]

CSS-фреймворк на 99% решает проблему кроссбраузерности.
Оставшийся 1% - для фанатов CSS, которые всё стремятся сделать стилями...

 

[vla]

[member=blackcot], я никогда не использовал фреймфорки, но в теме Microsoft провел поминки по Internet Explorer-6 вас раскритиковали. Поэтому, думаю, что это не лучшее решение. Но всё равно спасибо, что упомянули о них - фреймворки имеют место в этой теме.

вот кстати может вас заинтересует: http://twitter.github.com/bootstrap/

Я плохо владею английским, к сожалению... Не понял что это. Это какаято автоматизация труда программиста?

 

[medwoodu]

[member=blackcot], я никогда не использовал фреймфорки, но в теме Microsoft провел поминки по Internet Explorer-6 вас раскритиковали. Поэтому, думаю, что это не лучшее решение. Но всё равно спасибо, что упомянули о них - фреймворки имеют место в этой теме.

вот кстати может вас заинтересует: http://twitter.github.com/bootstrap/

Я плохо владею английским, к сожалению... Не понял что это. Это какаято автоматизация труда программиста?

http://habrahabr.ru/blogs/twitter/126714/