mdui
/
index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MDUI</title>
    <!-- MDUI CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdui@1.0.0/dist/css/mdui.min.css"
        integrity="sha384-2PJ2u4NYg6jCNNpv3i1hK9AoAqODy6CdiC+gYiL2DVx+ku5wzJMFNdE3RoWfBIRP" crossorigin="anonymous" />
    <link rel="stylesheet" type="text/css" href="css/alert-js.css">
    <script src="js/mdui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/home.css">
	<link rel="shortcut icon" href="img/icon.png">

</head>

<body class="mdui-drawer-body-left">
    <!-- Sidebar -->
    <div class="mdui-drawer" id="drawer">


        <ul class="mdui-list">

            <div class="textarea mdui-typo">
                <h3>&nbsp;示例</h3>
            </div>

            <li class="mdui-list-item mdui-ripple" onclick="location.href='try/login.html'">
                <i class="mdui-list-item-icon mdui-icon material-icons">account_circle</i>
                <div class="mdui-list-item-content">登录页面</div>
            </li>
            <li class="mdui-list-item mdui-ripple" onclick="location.href='try/register.html'">
                <i class="mdui-list-item-icon mdui-icon material-icons">star</i>
                <div class="mdui-list-item-content">注册页面</div>
            </li>
            <li class="mdui-list-item mdui-ripple" onclick="location.href='try/appbar.html'">
                <i class="mdui-list-item-icon mdui-icon material-icons">extension</i>
                <div class="mdui-list-item-content">AppBar</div>
            </li>


        </ul>
    </div>

    <!-- AppBar -->
    <div class="mdui-appbar">
        <div class="mdui-toolbar mdui-color-theme">
            <a href="javascript:;" id="toggle" class="mdui-btn mdui-btn-icon"><i
                    class="mdui-icon material-icons">menu</i></a>
            <a href="#" class="mdui-typo-headline">MDUI</a>
            <a href="#" class="mdui-typo-title">Home</a>
            <a href="https://www.mdui.org/docs/" class="mdui-typo-title">Docs</a>
            <a href="readme.html" class="mdui-typo-title">README</a>
        </div>
    </div>

    <!-- Check For JavaScript -->
    <noscript>
        <div class="alert-js">
            <p>啊哦，<code> JavaScript </code>似乎无法正常使用。请尝试打开<code> JavaScript </code>以获得最佳体验！</p>
        </div>
    </noscript>


    <!-- Main -->
    <div class="mdui-typo mdui-text-center">
        <div class="textarea">
            <h1>MDUI</h1>
            <h4>MDUI 漂亮、轻量且好用,它能让你更轻松地开发 Material Design 网页应用。</h4>
            <br />
            <button class="mdui-btn mdui-btn-raised mdui-ripple"
                onclick="location.href='https://www.mdui.org/docs'">开发文档</button>
            &nbsp;&nbsp;
            <button class="mdui-btn mdui-btn-raised mdui-ripple"
                onclick="location.href='https://www.mdui.org/docs/download'">立即下载</button>

            <br />
            <br />
            <hr />
            <br />


            <h5 id="friends">友情链接</h5>
            <div class="mdui-list">
                <a href="https://www.mdui.org" class="mdui-list-item mdui-ripple">MDUI</a>
                <a href="https://www.mdui.org/docs" class="mdui-list-item mdui-ripple">MDUI Docs</a>
            </div>
            <br />
            <br />
            <br />
            <br />
        </div>
    </div>
    <!-- MDUI JavaScript -->
    <script src="https://cdn.jsdelivr.net/npm/mdui@1.0.0/dist/js/mdui.min.js"
        integrity="sha384-aB8rnkAu/GBsQ1q6dwTySnlrrbhqDwrDnpVHR2Wgm8pWLbwUnzDcIROX3VvCbaK+"
        crossorigin="anonymous"></script>
    <script src="js/index.js"></script>
</body>

</html>