Укажите CSS для webkit / IE без отдельного CSS - PullRequest
Новая
       0

Укажите CSS для webkit / IE без отдельного CSS

0 голосов
/ 29 сентября 2011

Для IE я могу использовать это: 

.content {
   *padding: 10px;
   padding: 10px
}

При этом * -part будет использоваться только для IE. Есть ли такая хитрость для браузеров webkit? (Без их вызова в специальный .css для веб-браузеров?)

Ответы [ 5 ]

1 голос
/ 09 января 2012

Используйте следующее для целевого Webkit: 

x:-webkit-any-link { padding: 10px; }

Если вам нужно поддерживать IE7, добавьте следующее, чтобы отфильтровать это правило от применения к нему: 

 * > /**/ .content, x:-webkit-any-link { padding: 10px; }
1 голос
/ 07 декабря 2011

Я нашел новый способ вместо использования get_browser () для тех, у кого не установлено расширение. Этот новый способ - использование HTACCESS. Вам нужен модуль "mod_setenvif".

Вот код, который нужно поместить в файл .htaccess. Это регулярное выражение для серверной переменной HTTP_USER_AGENT. Если он совпадает, мы создаем переменную USER_AGENT для хранения соответствующего имени браузера. 

<IfModule mod_setenvif.c>
BrowserMatch "Mozilla" USER_AGENT=firefox
BrowserMatch "Safari" USER_AGENT=safari
BrowserMatch "Chrome" USER_AGENT=chrome
BrowserMatch "MSIE" USER_AGENT=ie
</IfModule>

Затем вы можете использовать новую переменную сервера в своем коде PHP. 

<body class="<?php echo $_SERVER['USER_AGENT'];?>">

Хорошего дня.

1 голос
/ 29 сентября 2011

Нашел приличный хак. Кажется, работает с первого взгляда:) 

@media screen and (-webkit-min-device-pixel-ratio:0) {
     div.panel-homepage div#plan-build-operate div.panel-pane ul.links a { padding-top: 20px;}
}
1 голос
/ 03 октября 2011

Если вы работаете с PHP, есть вызов функции:

get_browser ()

проверка по адресу: http://php.net/manual/fr/function.get-browser.php

Эта функция возвращает массив всей информации о клиентском браузере. Добавьте эту информацию в виде класса CSS в теге body.

Вы сможете настроить таргетинг на конкретный браузер без использования CSS-хака и иметь действующий код CSS.

Удачи!

1 голос
/ 29 сентября 2011

Нет такого взлома для браузеров на основе webkit. Тем не менее, вы можете добиться такого эффекта (в нескольких браузерах), используя: 

<script>
(function(){ //anonymous function to prevent leaking
  var d = document.createElement("div");
  d.style.cssText = "-webkit-border-radius:1px;"; // webkit, such as Chrome/Safari
  if(/webkit/i.test(d.style.cssText)){
      var style = document.createElement("style");
      style.src = "webkit-only.css";
      document.getElementsByTagName("head")[0].appendChild(style);
  }
})();
</script>

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

Аналогично, следующие префиксы могут использоваться для обнаружения других механизмов браузера:

  • -moz-border-radius:1px; - Геккон, такой как Firefox
  • -o-border-radius:0; - Опера
  • -ms-border-radius:0; - Трезубец, такой как Internet Explorer

Есть вероятность, что у вашего пользователя есть древний браузер, который не поддерживает border-radius, но, поскольку Chrome обычно обновляется (автообновление), решение webkit всегда должно работать. *

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...