zoukankan      html  css  js  c++  java
  • 超链接导航栏案例

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            *{
                padding:0;
                margin:0;
            }
            ul{
                list-style: none;
            }
            .nav{
                width: 960px;
                overflow: hidden;
                margin: 0 auto;
                background-color: purple;
                border-radius: 5px;
            }
            .nav ul li{
                float:left;
                width: 160px;
                height: 40px;
                line-height: 40px;
                text-align: center;
            }
            .nav ul li a{
                display: block;
                text-decoration: none;
                width: 160px;
                height: 40px;
                color: white;
                font-size: 20px;
                font-family: "Hanzipen SC";
            }
            .nav ul li a:hover{
                background: red;
                font-size: 22px;
                text-decoration: underline;
            }
    
        </style>
    </head>
    <body>
        <div class="nav">
            <ul>
                <li><a href="">导航</a></li>
                <li><a href="">导航</a></li>
                <li><a href="">导航</a></li>
                <li><a href="">导航</a></li>
                <li><a href="">导航</a></li>
                <li><a href="">导航</a></li>
            </ul>
        </div>
    </body>
    </html>
    导航栏

  • 相关阅读:
    cocos2d 多点触摸
    mac 下安装node.js
    黑鹰破解笔记(2)
    OD使用心得笔记二
    淘宝店开始进行审核
    黑鹰破解笔记(1)
    Lisp笔记1
    OD使用心得笔记一
    怒马
    近段时间的web开发
  • 原文地址:https://www.cnblogs.com/stfei/p/9088958.html
Copyright © 2011-2022 走看看