Javascript 在iframe中更改字体_Javascript_Html_Css_Iframe

Javascript 在iframe中更改字体

javascript html css iframe

Javascript 在iframe中更改字体,javascript,html,css,iframe,Javascript,Html,Css,Iframe,我有一个HTML页面，它有一个iframe。我想改变iframe内容的风格，但我似乎无法做到这一点我想将iframe中所有内容的字体改为“Tahoma”。这是我的代码： <!DOCTYPE> <html> <head> <title>phpinfo()</title> <style type="text/css"> #outerdiv { width:446px; height:246px; overflow:hidd

我有一个HTML页面，它有一个

iframe

。我想改变iframe内容的风格，但我似乎无法做到这一点

我想将

iframe

中所有内容的字体改为“Tahoma”。这是我的代码：

<!DOCTYPE>

<html>
<head>

<title>phpinfo()</title>
<style type="text/css">
#outerdiv
{
width:446px;
height:246px;
overflow:hidden;
position:relative;
}

#inneriframe
{
position:absolute;
top: -508px;
left: 0px;
width: 100%;
height: 615px;
font-family: Tahoma;
}
</style>

<script>
onload = function()
{
 document.frm.document.body.style.fontFamily = "Tahoma";
}
</script>

</head>

<body>
<div id='outerdiv '>
<iframe  name="iframe" src="http://m.sarafikish.com" id='inneriframe' name="frm" scrolling=no frameborder="0"  > </iframe>
</div>    
</body></html>


phpinfo（）
#外层
{
宽度：446px；
高度：246px；
溢出：隐藏；
位置：相对位置；
}
#内框架
{
位置：绝对位置；
顶部：-508px；
左：0px；
宽度：100%；
高度：615px；
字体系列：Tahoma；
}
onload=函数（）
{
document.frm.document.body.style.fontfamine=“Tahoma”；
}

仅当

iframe

的

src

设置为同一域上的页面或满足以下条件时，才可能执行此操作。您的问题没有指定您是否满足这些要求，但是如果满足这些要求，您可以使用来通过JavaScript操纵iframe

示例：

document.getElementById("inneriframe").contentDocument.body.style.fontFamily = "Tahoma";

如果要使用自定义字体：

var frame = $('#frameId');
frame.load(function () {
    var head = frame.contents().find('head');
    $('<link/>', {
        rel: "stylesheet",
        type: "text/css",
        href: "/url/to/style_with_fonts.css"
    }).appendTo(head);
    frame.contents().find('body').css('font-family', 'Custom Font');
}

var frame=$（'#frameId'）；
frame.load（函数（）{
var head=frame.contents（）.find（'head'）；
$('', {
rel:“样式表”，
键入：“文本/css”，
href:“/url/to/style_with_font.css”
}).附于（头部）；
frame.contents（）.find（'body'）.css（'font-family'，'Custom font'）；
}

var frame = $('#frameId');
frame.load(function () {
    var head = frame.contents().find('head');
    $('<link/>', {
        rel: "stylesheet",
        type: "text/css",
        href: "/url/to/style_with_fonts.css"
    }).appendTo(head);
    frame.contents().find('body').css('font-family', 'Custom Font');
}