手机百度浏览器fixed定位问题

如上边这样一张图片，底部有一个按钮 这个按钮固定在底部（fixed定位）；
看似很简单的一个效果实现，然而在百度浏览器却出现了问题：这个底部固定定位按钮会闪现之后就不见了，其他浏览器上正常显示，找了挺长时间的原因，才发现是百度浏览器的广告屏蔽机制，会让这种固定定位在底部的元素当作广告来屏蔽掉（隐藏移除不显示）。

找问题过程发现高度大于一定程度就不会被屏蔽，正常显示，网上说height<150px，百度就会认为是弹窗广告，进而关闭。

所以height>=150px就不会出现这个问题。 

解决方案：

底部不要100%宽度，且不要为一张图片

（高度未超屏）position：absolute 来实现相同效果

采用js来实现布局效果，动态插入

使用::after伪元素解决（实测，有用）

eg：以下布局height为60px，被百度屏蔽

<div id="download">
    <img src="./download.png" alt="download"/>
</div>


<style>
#download {
    position: fixed;
    left: 50%;
    z-index: 99;
    margin-left: -5rem;
    bottom: 0;
    width: 10rem;
    height: 1.6rem;
}
</style>

改为::after伪元素：

<div id="download"></div>

<style>
#download {
    position: fixed;
    left: 50%;
    z-index: 99;
    margin-left: -5rem;
    bottom: 0;
    width: 10rem;
    height: 1.6rem;
}
#download:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    background-size: cover;
    background-image: url('./download.png');
    background-position: 50%;
    background-repeat: no-repeat;
    width: 10rem;
    height: 1.6rem;
}
</style>