.hairline {
    position: relative;
}
.hairline:after {
    content: '';

    /* 放大 */
    position: absolute;
    top: -50%;
    bottom: -50%;
    left: -50%;
    right: -50%;

    /* 缩小 */
    -webkit-transform: scale(0.5);
            transform: scale(0.5);

    /* 边框 */
    border-width: 0;
    border-style: solid;

    /* 不遮挡 */
    pointer-events: none;
}

/* 全边框 */
.hairline--round:after {
    border-width: 1px; /* no */
}

/* 单边框 */
.hairline--top:after {
    border-top-width: 1px; /* no */
}
.hairline--right:after {
    border-right-width: 1px; /* no */
}
.hairline--bottom:after {
    border-bottom-width: 1px; /* no */
}
.hairline--left:after {
    border-left-width: 1px; /* no */
}

/* 输入框 */
.hairline--input input,
.hairline--input textarea {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    border-radius: inherit;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}