DB1*_*500 2 html css safari cross-browser
我正在建立以学习一些Web开发的网站的首页在我使用Safari浏览器测试过的所有浏览器(Windows)上均能正常运行。我有一个html步骤,这样我就可以将样式设置为100vw和100vh。在野生动物园中,它们的高度似乎为0;
<body>
<div id="wrapper">
<div class="main">
<section id="slide-one" class="slide"></section>
<section id="slide-two" class="slide"></section>
.
.
.
Run Code Online (Sandbox Code Playgroud)
以及CSS的摘要:
.slide {
position: relative;
padding-top: 0px;
height: 100vh;
width: 100%;
box-sizing: border-box;
}
Run Code Online (Sandbox Code Playgroud)
有什么想法我做错了吗?
你可以试试这个
if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1) {
//alert('Its Safari');
$('.main').css('min-height', '650px');
}
Run Code Online (Sandbox Code Playgroud)
虽然100vh css属性可在Mac默认的Safari浏览器上运行。但是在Windows的Safari中无法正常工作。
参考链接 使用jQuery检测Safari