draco1023
8/25/2016 - 6:13 AM

dot and wave

dot and wave

.dot {
    display: inline-block;
    position: relative;
}

.dot:before {
    content: '.';
    display: inline-block;
    position: absolute;
    bottom: -0.5em; /*对不同浏览器适配时可以修改该值调整点的上下位置*/
    font-weight: bold;
    left: 0;
    text-align: center;
    width: 100%;
    font-family: Microsoft YaHei;
    line-height: 0.9;
}

.wave {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAADCAAAAACVaiEnAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAHklEQVR4nGOQmP7//3Ufhvsyi+8rzGb4f91Bovs/AHHHCsFgywUGAAAAAElFTkSuQmCC) repeat-x 100% 100%;
    padding-bottom: 0.2em;
}