原生js实现tab栏切换

最新推荐文章于 2024-07-31 14:35:30 发布

阳光百般

最新推荐文章于 2024-07-31 14:35:30 发布

阅读量185

点赞数

文章标签：前端 javascript

本文链接：https://blog.csdn.net/m0_64739799/article/details/123840399

版权

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <style>
      * {
        margin: 0;
        padding: 0;
      }

      li {
        list-style-type: none;
      }

      .tab {
        width: 978px;
        margin: 100px auto;
      }

      .tab_list {
        height: 39px;
        border: 1px solid #ccc;
        background-color: #f1f1f1;
      }

      .tab_list li {
        float: left;
        height: 39px;
        line-height: 39px;
        padding: 0 20px;
        text-align: center;
        cursor: pointer;
      }

      .tab_list .current {
        background-color: #c81623;
        color: #fff;
      }

      .item_in

最低0.47元/天解锁文章

阳光百般

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
原生js实现tab栏切换

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <tit.
复制链接

扫一扫