uikit实现简洁响应式自适应后台管理页面代码-html代码-BFW代码库

uikit实现简洁响应式自适应后台管理页面代码

代码语言：html

所属分类：响应式

代码描述：uikit实现简洁响应式自适应后台管理页面代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">


    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="preload" href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" as="style">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" media="all" onload="this.media='all'">
    <noscript><link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" rel="stylesheet"></noscript>
    <!-- UIkit CSS -->
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/uikit.min.css">

    <!-- UIkit JS -->
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/uikit.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/uikit-icons.min.js"></script>

</head>

<body>
    <div class="uk-background-primary uk-light uk-preserve-color uk-hidden@m" uk-sticky>
        <nav class="uk-navbar" uk-navbar>
            <div class="uk-navbar-left">
                <a class="uk-navbar-toggle" uk-navbar-toggle-icon uk-toggle href="#offcanvas"></a>
            </div>
            <div class="uk-navbar-center">
                <a class="uk-navbar-item uk-logo" href="#">_board</a>
            </div>
            <div class="uk-navbar-right">
                <ul class="uk-navbar-nav">
                    <li>
                        <a href="#">
                            <img class="uk-border-circle" data-src="//repo.bfw.wiki/bfwrepo/image/60d41f5173b0d.png?x-oss-process=image/auto-orient,1/resize,m_fill,w_100,h_100,/quality,q_90" width="30" height="30" alt="Jane Doe" uk-img>
                        </a>
                        <div class="uk-navbar-dropdown">
                            <ul class="uk-nav uk-navbar-dropdown-nav">
                                <li>
                                    <a href="#"><span class="uk-margin-small-right" uk-icon="icon: user"></span>Profile</a>
                                </li>
                                <li>
                                    <a href="#"><span class="uk-margin-small-right" uk-icon="icon: settings"></span>Settings</a>
                                </li>
                                <li class="uk-nav-divider"></li>
                                <li>
                                    <a href="#"><span class="uk-margin-small-right" uk-icon="icon: sign-out"></span>Logout</a>
                                </li>
                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
        </nav>
    </div>

    <header class="uk-background-primary uk-navbar-container uk-navbar-transparent uk-light uk-preserve-color uk-visible@m" uk-sticky>
        <div class="uk-container uk-contain.........完整代码请登录后点击上方下载按钮下载查看