如何在 Android webview 中居中我的 HTML iframe？
Posted
技术标签:
【中文标题】如何在 Android webview 中居中我的 HTML iframe？【英文标题】：How I center my HTML iframe in Android webivew? 【发布时间】：2022-01-08 04:12:15 【问题描述】：我的 android webview 中有一个 iframe，我正在像这样加载：
String folderPath = "file:android_asset/";
String fileName = "index.html";
String file = folderPath + fileName;
webView.loadUrl(file);
iframe 是通过位于我的android/assests 文件夹中的 HTML 和 CSS 文件加载的。 HTML 和 CSS 看起来像这样。 HTML：
<!DOCTYPE html>
<html lang="en">
<body>
<link rel="stylesheet" type="text/css" href="default.css" />
<div class="abs-frame-container">
<iframe
id="my_frame"
src="my web page link"
scrolling="no"
allowtransparency="true"
style="border:none;overflow:hidden">
</iframe>
</div>
</body>
</html>
和我的 CSS
#my_frame
position: absolute;
top: 0%;
bottom: 0%;
right: 0%;
width: 117%;
height: 100%;
#abs-frame-container
top: 10%;
bottom: 0%;
position: relative;
iframe 中的网页在 webview 中显示良好。我想在 webview 中居中（垂直对齐）我的 iframe，以便它根据 webview 尺寸（高度）自动对齐。如果有人可以帮助我如何实现这一点，将不胜感激？
【问题讨论】：
【参考方案1】：您可以直接从 Java/Kotlin 调用 WebView 上的自定义 javascript。在the official documentation中有解释。
然后您可以将JavaScript script that adds CSS styles 设置为已加载的html 页面的一部分，并以此方式将您的iframe 居中。
【讨论】：
感谢您的建议。所以我已经拥有的 CSS 文件不足以解决问题？ 没有直接的方法可以从 android 代码中应用 css 文件。但是，如果您已经拥有所需的 css，那么将其“翻译”为 javascript 应该不难。我在答案中附上了一个链接，并附有一些示例。以上是关于如何在 Android webview 中居中我的 HTML iframe？的主要内容，如果未能解决你的问题，请参考以下文章