1像素圆角

结构:支持 -hover, hover 时为 class=".as-rc .as-rc-hover"

 一像素圆角  混排的文字

 由 <a/> 标签实现时不用加 .as-rc-hover  混排的文字
/*
  @ 名称: 1像素圆角
  @ 描述: 需要自己设置宽度,或者高度,否则会随内容自适应
  @ 用法:
    最外层:.as-rc
    内容层:.as-rc-cnt
    鼠标经过:.as-rc-hover
*/

/* base */
.as-rc{
    display:inline-block;vertical-align: middle;
    border-left:1px solid #ddd;border-right:1px solid #ddd;  /* 可重设 */
}

/*
  不要直接给 BOTTON | INPUT[type=submit[button]] 添加边框
  这会引发 IE 的 1px 的黑边 bug
  Note: 一般不要把 input 作为.as-rc-cnt 层
 */
.as-rc-cnt{
    float:left;position: relative;
    border-top: 1px solid #ddd;border-bottom:1px solid #ddd; /* 可重设 */
    margin:-1px 0;
}

/* HACK for ie6 7 */
div.as-rc, p.as-rc, h2.as-rc, h3.as-rc, h4.as-rc, h5.as-rc, h6.as-rc, ul.as-rc, ol.as-rc{
    *display: inline;
}

/* 鼠标经过 */
.as-rc-hover, .as-rc-hover .as-rc-cnt, .as-rc:hover, .as-rc:hover .as-rc-cnt{
    border-color: #aaa; /* 可重设 */
    text-decoration: none;
}

问题及注意事项:

最好不要给 INPUT[type=submit[button]] || BUTTON 直接添加border,避免 lte IE7 出现的1px 黑边 bug。