蓝色欧美风格的监控人脸识别后台管理系统源码下载



10 36 13



模板描述:蓝色欧美风格 监控人脸识别 后台管理系统,蓝色欧美风格的监控人脸识别后台管理系统源码下载html模板下载

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/base.css">

2. 引入JS

<script src="js/jquery.min.js"></script>

3. HTML代码

<!--总容器-->
<main class="index-section">
    <!--左侧-->
    <aside class="index-aside left">
        <!--左侧头部-->
        <header class="index-header">
            <img src="img/admin.png">
            <p>欢迎你!管理员</p>
        </header>
        <!--导航-->
        <nav class="index-nav">
            <ul class="nav-ul">
                <li class="li-active"><p><img src="img/home.png"> </p><a href="home.html" target="iframename">首页</a> </li>
                <li><p><img src="img/data-ph.png"> </p><a href="table.html" target="iframename">监测数据</a> </li>
                <li><p><img src="img/video.png"> </p><a href="user.html" target="iframename">监控视频</a> </li>
                <li><p><img src="img/anyais.png"> </p><a href="AssistantRun.html" target="iframename">统计分析</a> </li>
                <li><p><img src="img/anyais.png"> </p><a href="set.html" target="iframename">摄像头管理</a> </li>
                <li><p><img src="img/sysset.png"> </p><a href="playback.html" target="iframename">回放设置</a> </li>
            </ul>
        </nav>
    </aside>
    <!--右侧-->
    <article class="index-artie right">
        <header class="artie-header"><div class="header-logo"><img src="img/headLogo.png"></div><span class="header-exit"><i class="exit-i"></i><a href="javascript:void (0)">退出</a> </span></header>
        <section class="right-section">
            <iframe class="iframe-con" frameborder="0" name="iframename" src="home.html"></iframe>
        </section>
    </article>
</main>
<script>
    $(function(){
        $('.nav-ul li').click(function(){
            var dis=$(this).find(".nav_son_ul").css("visibility");
            if(dis=='hidden'){
                $(this).find(".nav_son_ul").css('visibility',"visible");
                $(this).find(".change_icon").removeClass("down_icon").addClass("up_icon");
            }
            else {
                $(this).find(".nav_son_ul").css('visibility',"hidden");
                $(this).find(".change_icon").removeClass("up_icon").addClass("down_icon");
            }
        })
    })
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 分类 响应式 自适应 设备 风格 颜色 bootstrap bootstrap自适应 bootstrap响应式 蓝色 欧美风 欧美 欧洲 美洲 pc+wap 移动+电脑 手机+电脑 简洁 简约 简单 后台系统 后台 系统

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到