提问者:小点点

safari浏览器的媒体查询


我希望媒体只能在屏幕为1280px的safari上工作

这个工作在所有浏览器,但我只想要safari

@media screen and (width: 1280px){


}

共2个答案

匿名用户

最好的选择是使用JavaScript:

下面是尝试这种检测的代码片段

null

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>

匿名用户

试试这个

WebKit:Chrome和; Safari(任何版本)

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

铬29+

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

狩猎(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 */
}}

狩猎(10.1+)

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

有用的链接:特定于浏览器的CSS和JavaScript黑客