html - 如何使用CSS更改iframe的src

标签 html css iframe

我有这段代码,并且不知道如何制作它,因此当我单击“菜单”中的元素时,不会重定向到其他页面,而是更改 iframe 的 src ..我应该更改

代码:

<html>
    <head>
        <title> First attempt at html/css </title>
        <style>
            #header {
                background-color:black;
                color:white;
                text-align:center;
                padding:5px;
            }
            #menu {
                background-color:#eeeeee;
                height:470px;
                width:200px;
                float:left;
                text-align:center;
                padding:5px;
            }
            #content {
                float:left;
            }
            #footer {
                background-color:black;
                color:white;
                clear:both;
                text-align:center;
                padding:5px; 
            }
        </style>
    </head>

    <body>
        <div id="header">
        <h1> Movies Gallery</h1>
        </div>

        <div id="menu">
        <a href="the_maze_runner.html" style="text-decoration:none"> The Maze Runner </a> <br>
        <a href="guardians_of_the_galaxy.html" style="text-decoration:none"> Guardians of The Galaxy </a> <br>
        <a href="the_guest.html" style="text-decoration:none"> The Guest </a> <br>
        <a href="edge_of_tomorrow.html" style="text-decoration:none"> Edge of Tomorrow </a>
        </div>

        <div id="content">
        <iframe src="the_maze_runner.html" width=1110px height=475px frameborder=0></iframe>
        </div>

        <div id="footer">
        Copyright Andrew.Xd 2014
        </div>
    </body>
</html>

我仍然是这个领域的初学者,所以我真的不知道应该如何修改代码以获得我想要的东西。

最佳答案

您只需向菜单项添加目标,并向 iframe 添加名称,如下所示:

<a target="frameName" href="the_maze_runner.html" style="text-decoration:none">The Maze Runner</a>

<iframe name="frameName" src="the_maze_runner.html" width=1110px height=475px frameborder=0></iframe>

或者我误解了这个问题?

关于html - 如何使用CSS更改iframe的src,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26102224/

相关文章:

javascript - Bootstrap-根据宽度调整元素的高度

javascript - 如何使用 JavaScript 在 IE 中将 iframe 父(顶部)位置更改为相对于 iframe 的 url?

javascript - IE9 在 iframe 中加载脚本时抛出异常。为什么?

html - CSS 网格居中

html - 如何使用CSS在Div底部绘制半圆

javascript - 如何创建减号和加号按钮来更新字段?

php - 用链接替换按钮

javascript - 为什么这个 Javascript 不起作用?风格变化

css - 总是以全屏尺寸读取 Sprite CSS?

javascript - 在 iframe 中单击并移动 'a href' 标记时防止移动文本