我设置了3个iframe。 iframe 1用于页面标题; iframe 2用于导航菜单和子菜单; iframe 3用于内容。我无法将导航栏中的子菜单项（位于iframe 2中）显示出来。我有以下代码可以反馈我如何解决这个问题。
index.php
<DOCTYPE HTML>
<HTML>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#headingiframe {
position: static;
overflow-x:hidden;
overflow-Y:hidden;
z-index: 1;
}
#contentiframe {
position : relative;
left:0;
top: 0;
z-index: 1;
}
#menuiframe {
position: relative;
overflow-Y:visible;
z-index: 5;
}
</style>
<div id="headingiframe">
<iframe width="100%" height="12%" src="header_on_screen.php" scrolling=NO > </iframe>
</div>
<div id="menuiframe">
<iframe width="100%" height="10%" src="show_menu.php" scrolling=NO > </iframe>
</div>
<div id="contentiframe">
<iframe width="100%" height="70%" src="contents.php" scrolling=YES > </iframe>
</div>
</head>
</body>
</html>
show_menu.php
<DOCTYPE HTML>
<HTML>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#outer {
position: relative;
left:0;
top: 0;
width: 100%;
z-index: 3;
overflow-Y:visible;
}
#inner{
background: green;
display: inline-block;
overflow-Y:visible;
}
.cover {
position: absolute;
border: none;
top: 0;
left: 0;
width: 100%;
z-index: 5;
overflow-Y: visible;
height:100%;
}
ul#menu, ul#menu ul.sub-menu {
padding:4;
margin: 4;
z-index: 6;
overflow-Y: visible;
display: inline-block;
}
ul#menu li, ul#menu ul.sub-menu li {
list-style-type: none;
display: inline-block;
overflow-Y: visible;
z-index: 6;
}
/*Link Appearance*/
ul#menu li a, ul#menu li ul.sub-menu li a {
text-decoration: none;
color: #fff;
background: #666;
padding: 10px;
display: inline-block;
overflow-Y: visible;
z-index: 6;
}
/*Make the parent of sub-menu relative*/
ul#menu li {
position: relative;
overflow-Y: visible;
z-index: 6;
}
/*sub menu*/
ul#menu li ul.sub-menu {
display: none;
position: absolute;
top: 30px;
left: 0;
width: 100px;
z-index: 6;
overflow-Y: visible;
}
ul#menu li:hover ul.sub-menu {
display:block;
position:absolute;
overflow-Y: visible;
z-index:6;
}
</style>
<head>
<body>
<div id="outer">
<div id="inner">
<div id="navMenu">
<ul id="menu">
<li>
<a href="#">About</a>
</li>
<li><a href="#">Menu 2</a>
<ul class="sub-menu">
<iframe class="cover" src="about:blank" ></iframe>
<li>
<a href="#">Sub Menu 1</a>
</li>
<li>
<a href="#">Sub Menu 2</a>
</li>
<li>
<a href="#">Sub Menu 3</a>
</li>
<li>
<a href="#">Sub Menu 4</a>
</li>
</ul>
</li>
<li><a href="#">Menu 3</a>
</li>
<li><a href="#">Menu 4</a>
<ul class="sub-menu">
<iframe class="cover" src="about:blank" ></iframe>
<li>
<a href="#">Sub Menu 1</a>
</li>
<li>
<a href="#">Sub Menu 2</a>
</li>
<li>
<a href="#">Sub Menu 3</a>
</li>
<li>
<a href="#">Sub Menu 4</a>
</li>
</ul>
</li>
<li>
<a href="#">Menu 5</a>
</li>
</ul>
</div>
</div>
</div>
</head>
</body>
</html>
Header_on_screen.php
<?php // header_on_screen.php
echo <<<_END
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">
<table style="width:100%">
<TR>
<TH style="color:green;text-align:center"><h2>iFrame Management System </h2></TH>
</TR>
<TR>
<TH scope="colgroup">Version 0.6 </TH>
</TR>
</table>
_END;
?>
Contents.php
<?PHP
echo"<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
<BR> The contents iFrame is where all contents will appear.
"
?>
答案 0 :(得分：0)
使用框架或iframe以某种方式创建网页布局是非常糟糕的选择。因为它们实际上是嵌入在一个页面中的不同页面。甚至搜索引擎也算作不同的页面。在2018年，你不应该以这种方式使用iframe。