网站中嵌入在线api

网站中嵌入在线api,便于查看,实际很简单,使用iframe既可以搞定

<html>
<head>
  <title>在线文档-jdk-zh</title>  
  <style>
  body {margin:0;padding:0;}
  iframe {margin:0;width:100%;}
  #apidoc_top {background:#006CBF;color:#fff;font-size:12pt;padding:2px 2px;width:600px;float:right;position:absolute;right:10px;top:20px;}
  #apidoc_top a {color:#fff;text-decoration:none;}
  #apidoc_top a:hover {color:#ff0;}
  #apidoc_top span {float:right;font-family:"Lucida Grande",Calibri,Arial,sans-serif;color:#DDD;}
  #apidoc_top span a {padding-right:5px;color:#fff;}
  </style>
</head>
<body>
<style>
h1{margin:0;padding:0;}
#header{background: #006cbf url(/img/headerBg.gif) left bottom repeat-x;height: 55px;position: relative;z-index: 1;}
#logo{background: url("/img/logo.gif") no-repeat;line-height: 50px;cursor:pointer;width:250px;margin:0 0 0 10px;}
.texthidden{text-indent:-9999px;white-space:nowrap;line-height:0;}

</style>
<!--     Tools头部header开始    -->
<div id="header">
    <div>        
        <div id="logo" class="texthidden" onClick="javascript:location.href='/'">
            <h1>xxx在线工具</h1>
        </div>
        <div id="apidoc_top">
    <span>

    <a href="/apidocs"><strong>返回API文档列表</strong></a>&nbsp;&nbsp;
        热门文档:
      <a href="?api=jdk_7u4">JDK7</a>
      <a href="?api=javaEE6">J2EE6</a>
      <a href="?api=Spring-3.1.1">Spring</a>
      <a href="?api=hibernate-4.1.4">Hibernate</a>
      <a href="?api=php-zh">jquery文档</a>

    </span>
</div>    </div>
</div>
<!--     Tools头部header结束    -->  
<table width='100%'><tr><td>
  <iframe id='iframe_doc' frameborder='0'
         src='文档主页的位置一般为index.html'
   οnlοad='this.height=document.body.clientHeight-80;'></iframe>
  </td></tr></table>
  </div>
</body>
</html>

填充对应的src 即可



©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页