layui自定义tab主页简单操作

最新推荐文章于 2024-06-20 09:27:42 发布

zduu_zhaodong

最新推荐文章于 2024-06-20 09:27:42 发布

阅读量5.4k

点赞数

文章标签： layui动态操作tab页

本文链接：https://blog.csdn.net/zduu_zhaodong/article/details/81172639

版权

一：layui资源，官网下载引入

二：直接上代码，我写的只为入门观看啊，大神就别批了，有些样式我直接改了，样式其实并不是什么大问题

.layui-layout-admin .layui-footer{height: 0px;}

.layui-layout-admin .layui-body{bottom: 0px;}

这两个样式是把那个底部固定栏给弄掉的，如果不弄掉也可以去除，代码很简单，很容易看懂的

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>layui后台框架整理+tab页动态操作</title>
    <link rel="stylesheet" href="source/layui/css/layui.css">
    <style>
        .zduu-darkblue {
            background-color: rgba(10, 162, 27, 0.57);
        }

        .zduu-darkblue li {
            background-color: rgba(10, 162, 27, 0.57);
        }

        .layui-nav-tree .layui-nav-item a {
            color: white;
        }

        .wh100 {
            width: 100%;
            height: 100%;
        }

        .layui-body {
            overflow: visible;
        }

        .layui-tab-title li.layui-this {
            font-weight: 700;
            background-color: #93D1FF;
            color: white;
        }

        .layui-tab {
            margin: 0px;
        }

        .tab-active {
        }

        .tab-close {
            position: absolute;
            right: 2px;
            top: -8px;
            display: inline;
            opacity: 0.2;
        }

        .tab-close:hover {
            opacity: 1;
        }

        .l

最低0.47元/天解锁文章

zduu_zhaodong

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
layui自定义tab主页简单操作

一：layui资源，官网下载引入二：直接上代码，我写的只为入门观看啊，大神就别批了，有些样式我直接改了，样式其实并不是什么大问题.layui-layout-admin .layui-footer{height: 0px;}.layui-layout-admin .layui-body{bottom: 0px;}这两个样式是把那个底部固定栏给弄掉的，如果不弄掉也可以去除，代码很简单，...
复制链接

扫一扫