我希望媒体仅在1280像素屏幕上在Safari浏览器中工作。
这适用于所有浏览器,但我只想在Safari中使用。
@media screen and (width: 1280px){
}
我希望媒体仅在1280像素屏幕上在Safari浏览器中工作。
这适用于所有浏览器,但我只想在Safari中使用。
@media screen and (width: 1280px){
}
试试这个
Webkit浏览器:Chrome和Safari(任何版本)
@media screen and (-webkit-min-device-pixel-ratio:0) {
property: value;}
Chrome 29+
:谷歌浏览器版本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 */
}}
有用的链接:针对不同浏览器的CSS和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中判断媒体类型是否为屏幕。
试试这个:
@media only screen and (width: 1280px) {
}