Html 更改 IFrame 字体样式/大小/颜色

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/35970561/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 19:04:36  来源:igfitidea点击:

Changing IFrame font style/size/color

htmlcss

提问by Vespher

I'm trying to change the font style, color, and size of the text inside an IFrame. The text is stored locally in a .txt file. How can I go about doing this?

我正在尝试更改 IFrame 中文本的字体样式、颜色和大小。文本存储在本地的 .txt 文件中。我该怎么做呢?

回答by Dmitriy

You can do it by following code:

您可以通过以下代码来完成:

<iframe id="myFrame" src="text.txt"></iframe>

<script>
var frame = document.getElementById('myFrame');
    frame.onload = function () {
        var body = frame.contentWindow.document.querySelector('body');
        body.style.color = 'red';
        body.style.fontSize = '20px';
        body.style.lineHeight = '20px';
    };
</script>

回答by robinp7720

To do this, the easiest method would be to directly include the styles in the file.

为此,最简单的方法是直接在文件中包含样式。

Just change your txt file to a .html file and use the style tag to change the look of the page via css

只需将您的 txt 文件更改为 .html 文件并使用样式标记通过 css 更改页面的外观

For example, your style tag could look like this:

例如,您的样式标签可能如下所示:

<style>
body{
   font-family: sans-serif;
   color: red;
   font-size: 2em;
}
</style>

This will create rather large text with your default sans-serif font and a red text color

这将使用默认的 sans-serif 字体和红色文本颜色创建相当大的文本

回答by Cannicide

This is not possible. Due to security issues regarding altering/manipulating website data/copyrights/login info, etc., Chrome, Firefox, and all other major browsers do not support this feature. However, something like what @DmitriyLoskutov mentioned would work in a minor or a hardly known browser. It is otherwise impossible to change the content, style, or script on a page that is not your own or not on the same page for security reasons. There are javascript libraries that can bypass this sort of thing, but it is unwise to use these as they can be harmful scripts and violate browser terms of use. The best way to style anything has always been to style it from inside the file. The best thing for you to do is create an html file with text on it, then style it (as @robinp7720 mentioned).

这不可能。由于涉及更改/操纵网站数据/版权/登录信息等的安全问题,Chrome、Firefox 和所有其他主要浏览器不支持此功能。但是,像@DmitriyLoskutov 提到的那样的东西可以在未成年人或鲜为人知的浏览器中使用。否则,出于安全原因,不可能更改不是您自己的页面或不在同一页面上的页面上的内容、样式或脚本。有一些 javascript 库可以绕过这类事情,但使用这些库是不明智的,因为它们可能是有害的脚本并违反浏览器的使用条款。设置任何样式的最佳方法始终是从文件内部设置样式。您最好做的事情是创建一个带有文本的 html 文件,然后对其进行样式设置(如@robinp7720 所述)。