HTML tab页实现

最新推荐文章于 2025-05-24 23:45:03 发布

AkiMonike

最新推荐文章于 2025-05-24 23:45:03 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： html js css 文章标签： HTML TAB页

本文链接：https://blog.youkuaiyun.com/akimonike/article/details/10827257

首先定义框架

两个h3 是tab页点击按钮最后是把这两个按钮放到一个div里

div1和div2 分别对应两个按钮点击显示的内容

定义前台框架


     <div id="tab" align="center">
     <div style="width: 300px; height: 26px; left: 0px; position: absolute;">
   <h3 class="up" onclick="go_to(1);" class="STYLE2" style="position: absolute; left: 0px; top: 0px"><p class="STYLE2">Div1</p></h3>
    <h3 onclick="go_to(2);"  class="STYLE2" style="position: absolute; left: 115px; top: 0px"><p class="STYLE2">Div2</p></h3>
    </div>
  <div id="Div1" style="top: 30px; left:0px; position: absolute;">

        <