字符实现各个方向等腰直角效果实例页面

CSS代码：

.char_corl,.char_corr,.char_cort,.char_corb {
    display: inline-block;
    width: 6px;
    height: 14px;
    line-height: 15px;
    margin-bottom: -3px;
    font-size: 12px;
    font-family: '宋体';
    overflow: hidden;
}
.char_corr,.char_cort {
    text-indent: -5px;
}
.char_corb,.char_cort {
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    position: relative\9;
    top:4px\0; *top:-2px;
}
                

HTML代码：

<span class="char_cort">◆</span>
<span class="char_corb">◆</span>
<span class="char_corl">◆</span>
<span class="char_corr">◆</span>