一聚教程网:一个值得你收藏的教程网站

热门教程

css写个按钮玩玩

时间:2022-07-02 12:40:42 编辑:袖梨 来源:一聚教程网

 代码如下 复制代码


我们再看CSS编码:

 Example Source Code [www.111com.net]
#menu {
    display:block;
    position:relative;
    background:#edebdc;
    width:112px;
    padding:25px;
    border:1px solid #000;
    margin:0 auto;
}
.white {
    position:absolute;
    width:100px;
    height:20px;
    color:#fff;/*www.111com.net*/
    background:#fff;
    border-top:1px solid #ffdc56;
    border-right:1px solid #957704;
    border-bottom:1px solid #937603;
    border-left:1px solid #ffdc56;
    overflow:hidden;
    text-align:center;
}
.blackc {
    position:absolute;
    top:0;/*www.111com.net*/
    left:0;
    width:98px;
    height:18px;
    color:#000;
    font-family:verdana;
    font-size:11px;
    font-weight:bold;
    overflow:hidden;
    border-top:1px solid #ffd42e;
    border-right:1px solid #caa205;
    border-bottom:1px solid #c9a105;
    border-left:1px solid #ffd42e;
    overflow:hidden;
    text-align:center;
    line-height:15px;
    background:#fc0;
}
.black {
    position:relative;
    top:0;/*www.111com.net*/
    left:0;
    width:102px;
    height:22px;
    border:1px solid #000;
}
.cona {
    position:relative;
    top:0;/*www.111com.net*/
    left:0;
    width:105px;
    height:25px;
    border-top:1px solid #d5d3ca;
    border-left:1px solid #d5d3ca;
    background:#f7f6ef;
}
.conb {
    position:relative;
    top:0;
    left:0;
    width:107px;
    height:27px;
    border-top:1px solid #b8b7af;
    border-left:1px solid #b8b7af;
    background:#f7f6ef;
}
.conc {
    position:relative;
    top:0;/*www.111com.net*/
    left:0;
    width:109px;
    height:29px;
    border-top:1px solid #9c9b95;
    border-left:1px solid #9c9b95;
    background:#f7f6ef;
}
.cond {
    position:relative;
    top:0;
    left:0;
    width:111px;
    height:31px;
    border-top:1px solid #d5d3ca;
    border-left:1px solid #d5dc3a;
    background:#fff;
    margin-top:2px;
}
#menu a.switch:visited {
    text-decoration:none;
}
#menu a.switch {
    color:#c00;
    text-decoration:none;
    position:absolute;
}
#menu a.switch:hover {
    color:#c00;
    background:#edebdc;
    cursor:pointer;
}
#menu a.switch:hover .white {
    position:absolute;
    width:100px;
    height:20px;
    color:#fff;
    background:#fff;
    border-bottom:1px solid #ffdc56;
    border-left:1px solid #957704;
    border-top:1px solid #937603;
    border-right:1px solid #ffdc56;
    overflow:hidden;
    text-align:center;
}
#menu a.switch:hover .blackc {
    position:absolute;
    top:0;/*www.111com.net*/
    left:0;
    width:98px;
    height:18px;
    color:#000;
    font-size:11px;
    font-weight:bold;
    overflow:hidden;
    border-bottom:1px solid #ffd42e;
    border-left:1px solid #caa205;
    border-top:1px solid #c9a105;
    border-right:1px solid #ffd42e;
    overflow:hidden;
    text-align:center;
    line-height:17px;
    background:#eb0;
}

热门栏目