zoukankan      html  css  js  c++  java
  • CSS——新浪导航demo

    主要运用的dispaly将a变成行内块,再用padding撑开宽度。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style type="text/css">
            .nav {
                height: 40px;
                background: #eee;
                border-top: 3px solid orange;
                border-bottom: 1px solid #aaa;
            }
    
            .nav-con {
                 1000px;
                height: 40px;
                margin: 0 auto;
            }
    
            a {
                font: 12px/40px 微软雅黑; /*40px=>line-height:40px;*/
                color: #333;
                display: inline-block;
                height: 40px;
                text-decoration: none;
                padding: 0 12px;
            }
    
                a:hover {
                    background: #999;
                }
        </style>
    </head>
    <body>
        <div class="nav">
            <div class="nav-con">
                <a href="#">设为首页</a>
                <a href="#">手机新浪网</a>
                <a href="#">移动客户端</a>
            </div>
        </div>
    </body>
    </html>
  • 相关阅读:
    KVM/QEMU简介
    编辑器制作的一些资源
    HRBEU ACM 图论 1006
    zoj 2001
    HRBEU equal
    zoj Integer Inquiry
    HRBEU 字符串 1003
    poj 2736
    SDUT_DP 1003
    zoj Martian Addition
  • 原文地址:https://www.cnblogs.com/wuqiuxue/p/7784488.html
Copyright © 2011-2022 走看看