先放上bug演示：

BugShow1
可以看到，在iPhoneX上，网页加载中会在白底的webView底部出现一块黑边，这个就很影响用户体验和美观了，如果加载时间长一点，这个效果就会更加明显。 BugShow2
经过测试，发现这个问题不只出现在iPhone X及以上机型，其他机型同样有，只是平时我们网络很快的话，不去拉就看不到底部的黑边，实际是存在超过屏幕外的地方 BugShow3（iPhone 8）
那么怎么解决这个问题呢？

解决方案(网上查阅资料得到) ：

self.webView.backgroundColor = [UIColor whiteColor];
self.webView.opaque = NO;

好了，如果只是想看这个问题如何解决的话，到这里就可以点左上角或者右上角叉叉关闭了，以下是我对这两行代码如何起作用的一些个人分析（扯淡😂）。

分析：

为什么这两行代码就解决了这个问题呢？是的，一开始我也以为只是iPhone X类机型才会出现的问题，会想用这样的代码去解决：

//非完美解决方案
self.webView.scrollView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;

这样是很方便，只一行代码，iPhone X以上机型不会再出现问题，但同时却也没有了底部自动缩进的效果，x类型设备滑到最底部的时候，网页最底部会紧贴着设备最底部，效果不太好，如果想要自动缩进的话就不方便了。

通过改变scrollView的Behavior属性为UIScrollViewContentInsetAdjustmentNever 完美解决方案

前者是相当于放弃safeArea自动缩进的功能来实现去黑边的效果，但是其他非X类机型上任然存在问题，而后面这个才是真正解决了问题，且不影响contentInsetAdjustmentBehavior属性的使用。
那么这两行代码是如何解决这个问题的呢？
我们先来看一下剖析图

解剖图
从图中我们发现UIWebView的结构是UIWebView的子视图是一个UIWebViewScrollView，然后UIWebViewScrollView上又有一个UIWebBrowserView，就是图中我选中的View,很明显黑边也就是这个东西导致的。

然后我们从opaque入手，从官方文档上，我们得到这样的介绍

This property provides a hint to the drawing system as to how it should treat the view. If set to YES, the drawing system treats the view as fully opaque, which allows the drawing system to optimize some drawing operations and improve performance. If set to NO, the drawing system composites the view normally with other content. The default value of this property is YES.

也就是说，如果这个属性为YES，这个视图就表现出这个属性的字面意思，不透明，并且绘图系统会进行一些优化来提升性能；如果设置为NO，绘图系统将会把它和其他视图结合在一起，肯定也不会进行性能优化，所以，这里我们把它关闭，实际上需要它透明，然后不用优化性能。emmm...

？？？
所以这跟我们实现的效果有什么关联呢？

好吧，试着去理解一下，是我们这里的webBrowserView导致的问题，那么就从它下手，这里提到透明，难道是把webBrowserView变透明了？嗯？但是我们这里设置opaque为NO的不是webView吗？说着我尝试了一下。
因为我是用storyboard做的，webView默认opaque 为YES。

我们在这里打个断点 啵一下webView的opaque 可以看到webView只有一个subView 通过刚才的图层分析，我们知道webBrowserView在webScrollView之上，所以这里啵出webScrollView的subViews，直接找到了我们要的webBrowserView 一步步来，所以这里啵出的就是webBrowserView的opaque属性

总结一下，正好webView和webBrowserView的opaque属性都为YES，好，那我们按照解决方案中说的改为NO试试。

在storyBoard上改为NO
运行起来： 啵一下证明改了 再啵一下webBrowserView的opaque属性，等等，我发现了什么！

将webView的opaque属性改成NO后webBrowserView的opaque也变成NO了，是不是父视图的opaque属性改变会导致相应的子视图的opaque属性跟着变化呢？我也去做了一个实验，结果证明并没有绝对的关系，大家有兴趣可以试试在一个View上add另一个view，然后两个view的opaque设置不同，打断点，啵出他们的opaque属性，会发现没有丝毫影响。

那这里因为webView是系统封装的一个独特的视图，它内部可能有什么不为人知的秘密我这里就只能做个猜测了，如果有懂其中原理的大神还望评论区留言，谢谢啦🙏！

这里至少证明了webBrowserView的opaque会随着webView的opaque属性相应改变。

好，我们执行了第一句webView的opaque设置为NO的代码，看下效果

效果1
整个webView加载后变成了网页默认的背景颜色，看下剖析图： 解剖图1
webBrowserView和webView的背景颜色变成一样了，我们改变一下webView的颜色来证明这个结论： 效果2 解剖图2

可以看到，将webView背景颜色设为绿色后，webBrowserView的背景也变为绿色了。

OK,那么第二句webView.backgroundColor = [UIColor whiteColor]也可以解释了，webView的opaque设置为NO后，webBrowser就没有了黑边，并且颜色跟webView的背景颜色一样，之所以要写成白色，可能大多数需求都是白色吧，所以这里又获得一个技能，想要设置成啥颜色直接改变webView的背景颜色就可以了，不一定是白色，按照需求来就可以了。

总结：

当webView的opaque属性为YES时，webBrowserView的opaque属性也为YES,这个时候，webBrowserView不透明，且绘画系统会对它进行优化，可能认为是直接渲染成白色比较省性能吧，也就是性能优化的结果，而底部的黑边就是加载网页的内部控件所留下的效果了（关于webBrowserView内部控件，就触及到我的盲区了，如果有懂这其中原理的请不吝赐教），总之也是跟性能优化相关；

而将webView的opaque属性设置为NO时，webBrowserView也会相应的设置opaque为NO（没有为什么，系统封装的控件），这个时候绘画系统就认为webBrowserView是透明的，却是直接将webBrowserView的颜色设置为webView的颜色，可能是因为webBrowserView要加载并显示网页的内容，不能设置成透明的原因吧，所以并没有让它透明，而是做了一个类似透明的效果，也就是将背后视图的颜色设置为自己的颜色（哈哈，你懂得，猜测）。