我正在尝试将 youtube 视频 iframe 放在 WebView 组件中并且效果很好，但是当我想设置 WebView 组件的大小时以匹配 iframe 大小时，它总是在视频周围留下奇怪的边框。真正奇怪的是，将 iframe 宽度设置为屏幕宽度会在正确的站点上产生巨大的差距。我尝试了很多方法，比如将 WebView 包装在 View 标签中并将此 View 组件高度设置为 iframe 高度，但它总是在顶部和底部留下边框，这导致 WebView 在网站上有一个滚动条。
图片如下: link
这是我的代码
render() {
return(
<WebView
source={{html: `<html><body><iframe width="${this.SCREEN_WIDTH}" height="315" src="https://www.youtube.com/embed/ojmk5tSj0sE" frameborder="0" allowfullscreen></iframe></html></body>` }}
style={{height: 20}}
>
</WebView>
)
}
如您所见，我尝试在此处设置 height = 20，但 id 没有任何改变，我仍然可以看到整个视频。我尝试了 automaticallyAdjustContentInsets={false} 和 scalesPageToFit={true}。我也试过:
marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"
在 Iframe 中没有结果。
我读了this有同样问题的人发帖，但没有得到答复
这看起来很简单，但它阻止了我在我的应用程序上取得进展。我是 100% 肯定有人已经在 react-native 中制作了带有 0 边框和边距的嵌入 iframe :P。如果您看到一些示例，请告诉我。
最佳答案
body 有 margin 和 padding 的默认值。 对于不需要任何边框的情况。只需将边距和填充设置为零即可。
例如:
来自:
<html><body>....</body></html>
收件人:
<html><body style="padding: 0; margin: 0;">...</body></html>
关于android - WebView 嵌入视频始终在视频周围有白色边框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44541688/