移动端fixed定位，两个元素间出现缝隙的问题。

两个元素分别做绝对定位，上下两个元素间在pc端没有缝隙，但是在移动端有1px的缝隙。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/reset.css">
    <script name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no'>
    </script>
    <title>移动阅读器</title>
    <style>
        .bkg{
            width: 100%;
            position: fixed;
        }
        .bkg1{
            width: 100%;
            height: 100px;
            position: absolute;
            top: 0;
            left: 0;
            background: black;
        }
        .bkg2{
            width: 100%;
            height: 100px;
            position: absolute;
            top: 100px;
            left: 0;
            background: black;
        }
    </style>
</head>
<body>
    <div class='bkg'>
        <div class='bkg1'></div>
        <div class='bkg2'></div>
    </div>
    
</body>

阅读 5.7k

在style里面加上全局样式即可。
*{margin: 0;padding: 0;}

*代表整个项目中所有的元素被选中，选中之后，所有的margin和padding都为0
即
最终代码为：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/reset.css">
    <script name='viewport' content='width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no'>
    </script>
    <title>移动阅读器</title>
    <style>
    *{margin: 0;padding: 0;}
        .bkg{
            width: 100%;
            position: fixed;
        }
        .bkg1{
            width: 100%;
            height: 100px;
            position: absolute;
            top: 0;
            left: 0;
            background: black;
        }
        .bkg2{
            width: 100%;
            height: 100px;
            position: absolute;
            top: 100px;
            left: 0;
            background: black;
        }
    </style>
</head>
<body>
    <div class='bkg'>
        <div class='bkg1'></div>
        <div class='bkg2'></div>
    </div>
    
</body>

因为手机和电脑的浏览器对元素的默认边距不一样，导致两种设备看到的效果不一样，你在手机上看不到边距，事实上是手机没有定义，而电脑浏览器会默认给元素加上默认的边距。
加上*{margin:0px;padding:0px;}
这样的话，无论手机或者电脑，都不会存在差异。

移动端fixed定位，两个元素间出现缝隙的问题。

你尚未登录，登录后可以

H5页面点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？

想在H5项目，Vue3中实现扫一扫的功能，怎么实现比较好？

H5 页面在IOS safari 中点击可以放大的问题？想禁用这个放大的功能？

如何用 CSS 实现卡片顶部内凹效果？

vue2如何对一个div实现v-model绑定？

怎么用css 实现这个形状？

关于标签上的事件绑定生效？

移动端fixed定位，两个元素间出现缝隙的问题。

你尚未登录，登录后可以

H5页面 点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？

想在H5项目，Vue3中实现扫一扫的功能，怎么实现比较好？

H5 页面在IOS safari 中点击可以放大的问题？想禁用这个放大的功能？

如何用 CSS 实现卡片顶部内凹效果？

vue2如何对一个div实现v-model绑定？

怎么用css 实现这个形状？

关于标签上的事件绑定生效？

H5页面点击按钮使用window.open 打开并展示一个pdf，安卓变成下载了？