Как создать класс столбца, используя less и цикл с отзывчивым?

Question

Я не пытался создать класс столбца, используя less и loop, но я буду использовать минимальный медиа-запрос для разных-разных, но я хочу метод esay для создания класса столбца с отзывчивым, пожалуйста, помогите мне.Спасибо в Adavance

@cols: 12;
@media all and (min-width: 1200px) {
    .generateCols(@counter) when (@counter > 0) {
        @width: (@counter / @cols ) * 100;
        .col-xl-@{counter} {
            width: ~"@{width}%";
        }
        .generateCols((@counter - 1));
    }
    .generateCols(12); 
}
@media all and (min-width: 992px) {
    .generateCols(@counter) when (@counter > 0) {
        @width: (@counter / @cols ) * 100;
        .col-lg-@{counter} {
            width: ~"@{width}%";
        }
        .generateCols((@counter - 1));
    }
    .generateCols(12); 
}
@media all and (min-width: 768px) {
    .generateCols(@counter) when (@counter > 0) {
        @width: (@counter / @cols ) * 100;
        .col-md-@{counter} {
            width: ~"@{width}%";
        }
        .generateCols((@counter - 1));
    }
    .generateCols(12); 
}
@media all and (min-width: 0) {
    .generateCols(@counter) when (@counter > 0) {
        @width: (@counter / @cols ) * 100;
        .col-xs-@{counter} {
            width: ~"@{width}%";
        }
        .generateCols((@counter - 1));
    }
    .generateCols(12); 
}