Внимание! Материал устарел и использовать хак только для Chrome уже не получится. Смотрите комментарии к посту. Свежие хаки для Google Chrome можно найти здесь
Ажиотаж вокруг браузера от Google растет. Уже более одного процента пользователей сети используют Chrome для серфинга. Думаю, что эта тенденция будет положительной и динамичной.
В целом браузер довольно корректно работает с CSS, очень похож на Safari, потому что работает на движке WebKit. Поэтому большинство хаков для Safari подойдут и для Chrome.
Поэтому, если вам надо прописать специфичный стиль, как для Safari, так и для Сhrome, то можно использовать хак body:first-of-type. А также могут пригодится специальные хаки для Safari 3+
Однако, похож, да не совсем. Есть в нем некоторые свои нюансы. Например не очень корректное отображение элементов форм. Причем не всегда помогают даже reset.css и пользовательские стили со строгими правилами. В общем, в скором времени, все равно придется брать в расчет Chrome при верстке.
И уже сейчас удалось найти один специальный хак для него:
body:nth-of-type(1) p{
color: #333333;
}
Удачной вам верстки:)
Сергей
Формы он обрабатывает по-своему, позволяя пользователю менять размер формы произвольно.
А в чём смысл вашего хака?
Hiway
Смысл в том, что это правило позволяет применить стиль для элемента только в случае его отображения в Google Chrome. То есть только для этого браузера, чтобы добиться единства визуального оформления страница в различных пользовательских агентах, правда в ущерб валидности документа.
Vetal
Этот хак отлично тянет на себя и Мозилла, т.ч. не подходит…
Удар
Ребет, как думаете, если рейтинг браузера Google будет продолжать расти, то это может убить конкуренцию и отдать всё так сказать пространство в интернете на откуп компании Google?
boberov
Главное что-бы Google не обнаглел, и не увлекся спамом чрезмерным или там болезнью звездной заболел…
Алена
«Главное что-бы Google не обнаглел, и не увлекся спамом чрезмерным или там болезнью звездной заболел…» — не логично, у гугла уже все есть
Sergey
надеюсь так и останется 1%, хоть я и не виде нового браузера, вполне хватает то что есть.
Zodios
Для меня пока самый большой недостаток хрома — плохая работа с флешем и нестандартное поле загрузки файлов.
По поводу хаков есть вещи которые работают сафари-хром-опера
Hiway
>Zodios
Спасибо за ссылку и вообще блог у тебя очень неплохой.
ARS
Хаки работают так же и в опере. А нет ли какого-нибудь хака, действующего только под Chrome (Safari)?
SireX
Подразумевалось, как нужное — но ни тут-то было… Проблема: сделанное меню отображается неправильно (на пару пикселей) в Safari (version 3.2), google Chrome отображает все нормально. Фиксим — по рейтингу Safari превосходит GC — багу в Safari с помощью хака, который естственно затрагивает и Chrome — и в нем меню едет.. В поисках антихака забрел на эту страничку — и попробовал.. Не хочет показанный хак перебить хак для Safari — а жаль..
Использовал хаки для Safari:
body:first-of-type #element { color: red; }
html[xmlns*=»»] body:last-child … { … }
@media all and (min-width:0px) { body:last-child … { … } }
body:last-child:not(:root:root) .style {background: #F00;}
И еще, по-моему, какие-то.. =) Все они затрагивают как Safari так и Chrome. Вобщем, как-то так — не работает предложенный хак в моем случае =((
Используется:
Есть идеи?
SireX
Под используется я вставил доктайп (съел как тег, наверн =) ):
!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Transitional//EN» «http://www.w3.org/TR /xhtml1/DTD/xhtml1-transitional.dtd»
Hiway
Это сайт смотрели ?
SireX
Теперь посмотрел (НУ И ДИЗАЙН о_О) — ничего путного..
Я вот думаю, что возможно дело в версии не только Safari, но и Google Chrome!? Моя версия 1.0.154.65 — и, честно говоря, не знаю, стоит ли обновлять эту версию до 2ки — потому что неизвестна статистика использования..
В целом, этим браузером я доволен — да и Safari начал «не слушаться» недавно.. (и как же тут не вспомнить про «как Ленин мертвый, но живой» Ie6) — так что вопрос не самой высокой важности!
Кто-нибудь еще тестил приведенный хак? работает?
Hiway
Хак работает. Я лично его тестил, но по опыту еще скажу, что Chrome очень чувствителен к наследованию собственных дефолтных стилей. Поэтому внимательно просмотрите верстку. Просмотрите, какие правила наследуются. И еще, есть такая штука, как рефакторизация, то есть, иногда есть смысл немного поменять конструкцию верстки и избавится от проблем.
sordes
Этот «специальный хак» прекрасно понимается Safari 3.2.2 под венду. И хотя движок одинаков, однако, скажем, у этих браузеров разная высота панели инструментов, из-за чего они высоту в процентах считают по-разному при одинаковом разрешении. И что с этим делать — совершенно непонятно.
hiway
@sordes: Подумай сам, о том, что ты сказал. Как может зависеть высота в загруженном документе от высоты активной области окна? Если содержимое превышает высоту активной области, то появляется скрол, а 100% это высота именно области дерева элементов между html и /html. Если высота вписывается по контенту в активное окно то опять же нет смысла в тових словах. Или ты подразумеваешь резиновость верстки в том что и вертикальные значения задаются в процентах. Где здесь логика и все-таки, я думаю, резиновость верстки заключается в отсутствия горизонтального скролла и масштабируемости элементов верстки по горизонтали. А вертикальный скролл — никто не считает неуместным.
Max
ff3.5 поддерживает это свойство. Вообще проблема у меня с этим, так как мне надо получить именно chrome (в safari, хоть и движок тот же, поддерживается font-face, а в chrome — нет 🙁 )
hiway
Скорее всего, в 3 версии хрома поддержка font-face будет реализована. Поскольку это свойство относится к CSS3, то не стоит пока стремится вывести его везде. Достаточно наличие его объявления, а браузер разберется выводить или нет. Просто используя это свойство не забывайте, что в ie6-8 оно не работает.
Kiba
представленный хак (который только для хрома) работает посему то у меня в мозилле 3,5
WebDisaster
> Не хочет показанный хак перебить хак для Safari — а жаль..
—
Аналогично. Стили, прописанные с этим хаком для Chrome, точно так же воспринимаются и Safari for Win 3.1.2. К сожалению, мне это не помогло.
V3
имхо так неактуален, поскольку оказывает влияние также и на другие браузеры… и в конце концов, как заметили выше, мозилла начиная с версии 3.5 тоже стала понимать этот хак…
hiway
Не могу возразить вашему замечанию. Но просто статья писалась, то того как был запущен FF 3.5.
glu2006
В ИЕ начиная с версии 4.0 свойство @font-face работает, просто не все умеют им пользоваться 🙂
если интересно то материалы по теме тут:
Материал проверен и это работает во всех браузерах кроче чудного Хромого, даже третьей версии.
Lika
Не работает твой хак: фаерфокс его тоже видит 🙁
Andrey
Здравствуйте! Мне надо сделать так, чтобы если Google Chrome, то подключалась одна версия jquery, а если другой браузер, то другая версия jquery. Подскажите, пожалуйста, как это можно реализовать.
pro design blog
спасибо, то, что нужно
Александр
А как етот хак использовать типа body:nth-of-type(1) а потом идет класс который я хочу чтобы отображался только в хроме?
BOLVERIN
в Опере 10.63 этот хак нормально считуется
axel
хак не совсем специальный скажем, он под сафари пшет жж
Михаил
Доброго времени суток.
И все же почему гугл, опера и другие, не могут использовать стандартные правила отображения зачем предлагать продукт, который в той или иной степени как то не поддерживает определенные теги стилей, блоков css ?
Да в связи с этим поэтому и 1% всего пользователей ими пользуются, а верстальщикам голову ломать как отобразить там и там и тут, и что бы овцы целы — и волки сыты.
Спасибо.
Konstantin
Не работает хак этот! Его понимают Safari и FF. Есть какое-то другое решение именно для Chrome?!
andrey
Не работает. Ие9 Видит его тоже. Можете убрать чтоб не запутывать народ.
Hiway
Константин. Убирать не буду. Но обязательно добавлю сюда кое-что новенькое, что специфично для последних версий Хрома. Дело в том, что этот пост писался еще когда IE9 не существовало.
Лариса
Спасибо большое! Очень пригодился хак!
yana
охуенный хак… стили подгружает не только хром, но еще и firefox
Hiway
, все дело в том, что материал писался еще до того, как какой-либо из существующих браузеров понимал этот синтаксис. В материале сделаю правку.
Kolass
А другой какой-то хак имеется? То запара с бэкграундом резиновым в хроме.
Hiway
Да есть, вот написал про ресурс, где