网页顶部导航图布局

代码语言:html

所属分类:布局界面

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <style>
        .container {
            margin: 0 auto;
            max-width: 1000px;
        }
        .navigation {
            width: 100%;
            height 80px;
            padding: 15px 0;
            background-image: linear-gradient(-90deg, #fff, #eee);
            box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.3);

        }
        .logo {
            color: #888;
            width: 20%;
            float: left;
            line-height: 40px;
        }
        .navigation-links {
            text-align: right;
        }
        .navigation-links li {
            color: #888;
            display: inline-block;
            padding: 10px 20px;
            border-radius: 20px;
            -webkit-transition: all .8s;
            /* Safari prior 6.1 */
            transition: all .8s;
        }

        .navigation-links li.ac.........完整代码请登录后点击上方下载按钮下载查看

网友评论0