[]
        
(Showing Draft Content)

FlexGrid의 사용자 정의 필터 아이콘

CSS를 사용하여 FlexGridFilter에 표시된 아이콘을 사용자 정의할 수 있습니다.

사용자 정의 아이콘을 만들 수 있습니다:

/* show images on filtered columns */
.wj-glyph-filter {
    background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABKUlEQVQ4ja2QP0vDQBiHf/cndzQhJKGGK6HQHFnsII4h4GfQqas4+zGcXDs5dNRPYj+EoFt316CDPZcrhNY0Mb0HnuV43+e4AxxhjKF1XU+bZ3MANwOdH9wghHgAYIZod/8OKqWWRVHc9VEptWwNJklyBeCbUrrRWs8Wi4U4ptZ6RindAPiyu4cEQXALYMsYM57nHZUxZgBs7U47vu/3/ks72wlhjL10xRhjz31iAICqqkac83VbjHO+rqpq1DsIAGEYjoUQH1JK01QI8R6G4fhfsR15nk+SJLlomuf5ZFAMANI0fcTec+3ZacEoilZRFK2cBQGcW90EpZT3ToJKqWtCyCcA43ne28lBAMiy7ExK+UQI+XES3BHH8aWU8tVZ0ELKspx2jznkF5WQhrjMdSwdAAAAAElFTkSuQmCC');
    background-repeat: no-repeat;
    background-position: bottom right;
    margin-top: 2px;
    width: 20px; height: 20px;
    border: none;
}
.wj-glyph-filter:after {
    display: none;
}
/* make active filter images 25% larger */
.wj-filter-on .wj-glyph-filter {
    transform: scale(1.25)
}

또는 기존 아이콘의 색상을 사용자 정의 할 수 있습니다:

/* change the color of the filter glyphs */
.wj-glyph-filter {
    color: red;
    font-size: 125%;
}