§ ITPOW >> 文档 >> CSS

CSS 数字外框效果

作者:vkvi 来源:ITPOW(原创) 日期:2009-1-5

效果

CSS 数字外框效果

代码

CSS 代码:

li
{
    float:left;
    overflow:hidden;
    margin-left:3px;
    padding:3px 5px 3px 5px;
    border:1px solid #FF0000;
    background-color:#000000;
    color:#FFFFFF;
    text-align:center;
    line-height:100%;
    font-size:12px;
    font-weight:normal;
    cursor:pointer;
}
.active
{
    background-color:#CC0000;
    color:#FFFFFF;
    font-weight:bold;
}

HTML 代码:

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li class="active">4</li>
  <li>5</li>
</ul>

示例


[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]
相关文章