目标:后台系统,点击侧栏菜单后,右边div的要显示对应的内容。就是说,每选一下左边的菜单,右边的内容都要变化。
方法:使用iframe框架。
第一步:在需要展示的div中写iframe:
<iframe src=“要插入的html文件.html” name="iframe(任意取名)" width=420 height=330 frameborder=0 scrolling=auto>如果浏览器不支持iframe框架,会向用户显示这里的文字</iframe>
第二步:在相应的li中写:
<li><a href="要显示的html文件.html" target="iframe的name">项目管理</a><iframe>
最后成型的代码:
另外一个更加清晰简单的实现:
<html> <body> <a href= "1.html " target= "iFrame1 "> page1 </a> <br/> <a href= "2.html " target= "iFrame1 "> page2 </a> <br/> <a href= "3.html " target= "iFrame1 "> page3 </a> <br/> <a href= "4.html " target= "iFrame1 "> page4 </a> <br/> <div id= "iFrame1 " style= "position:absolute; left:220px; top:200px; z-index:18 "> <iframe name= "iFrame1 " width=542 height=615 src= "1.html " scrolling= "auto " frameborder= "0 "> </iframe> </div> </div> </body> </html>