css 按钮效果

Posted on Posted in css
<html>
    <head>
    </head>
    <style>
        kbd {
            display: inline-block;
            padding: 3px 5px;
            font-size: 11px;
            line-height: 10px;
            color: #444d56;
            vertical-align: middle;
            background-color: #fafbfc;
            border: solid 1px #c6cbd1;
            border-bottom-color: #959da5;
            border-radius: 3px;
            box-shadow: inset 0 -1px 0 #959da5;
            font: 11px "SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;
        }
    </style>
    <body>
        <kbd style="background-color: rgb(204, 232, 207);">按钮效果</kbd>
    </body>
</html>

效果如下

按钮效果

» 转载请注明来源:若我若鱼 » css 按钮效果

Leave a Reply

Your email address will not be published. Required fields are marked *

five + fourteen =