Медиа-запрос для браузера Safari - PullRequest
Новая
       3

Медиа-запрос для браузера Safari

0 голосов
/ 13 июля 2020

Я хочу, чтобы медиа работали только в сафари для экрана с разрешением 1280 пикселей

Это работает во всех браузерах, но мне нужно только сафари 

@media screen and (width: 1280px){


}

Ответы [ 3 ]

1 голос
/ 13 июля 2020

Лучше всего использовать JavaScript:

Вот фрагмент, чтобы попробовать это обнаружение 

if (navigator.userAgent.toLowerCase().indexOf('safari/') > -1 && screen.width=="1280px") {
  console.log("True")
}else {
  document.getElementById("a").display = "none"
  console.log("False")
}
<html>
  <head></head>
  <body>
    <p id="a">Safari mobile<p>
  </body>
</html>

Я не знаю, как узнать, отображается ли тип носителя CSS.

0 голосов
/ 14 июля 2020

попробуйте это: 

@media only screen and (width: 1280px) {


}
0 голосов
/ 13 июля 2020

Попробуйте это

Webkit: Chrome и Safari (любая версия) 

@media screen and (-webkit-min-device-pixel-ratio:0) { 
property: value;}

Chrome 29 + 

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) {
.chrome {
    property: value;
}}

Safari (7.1 +) 

_::-webkit-full-page-media, _:future, :root .safari_only {
property: value;}

Safari (от 6.1 до 10.0) 

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { 
@media {
    /* Your Class */
}}

Safari (10.1 +) 

@media not all and (min-resolution:.001dpcm) { 
@media {
    /* Your Class */
}}

ПОЛЕЗНЫЕ ССЫЛКИ: для браузера c CSS и JavaScript хаки

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

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

...