sassの繰り返し処理を使ったクラス付与のメモ ref: https://qiita.com/ryosuketter/items/93080a2ed03fe74c084f

file0.css

.class0-0 {
  width: 0.0px;
}

.class0-1 {
  width: 0.1px;
}

.class0-2 {
  width: 0.2px;
}

.class0-3 {
  width: 0.3px;
}

.class0-4 {
  width: 0.4px;
}

.class0-5 {
  width: 0.5px;
}

.class0-6 {
  width: 0.6px;
}

.class0-7 {
  width: 0.7px;
}

.class0-8 {
  width: 0.8px;
}

.class0-9 {
  width: 0.9px;
}

.class1-0 {
  width: 1.0px;
}

.class1-1 {
  width: 1.1px;
}

.class1-2 {
  width: 1.2px;
}

.class1-3 {
  width: 1.3px;
}

.class1-4 {
  width: 1.4px;
}

.class1-5 {
  width: 1.5px;
}

.class1-6 {
  width: 1.6px;
}

.class1-7 {
  width: 1.7px;
}

.class1-8 {
  width: 1.8px;
}

.class1-9 {
  width: 1.9px;
}

.class2-0 {
  width: 2.0px;
}

.class2-1 {
  width: 2.1px;
}

.class2-2 {
  width: 2.2px;
}

.class2-3 {
  width: 2.3px;
}

.class2-4 {
  width: 2.4px;
}

.class2-5 {
  width: 2.5px;
}

.class2-6 {
  width: 2.6px;
}

.class2-7 {
  width: 2.7px;
}

.class2-8 {
  width: 2.8px;
}

.class2-9 {
  width: 2.9px;
}

.class3-0 {
  width: 3.0px;
}

.class3-1 {
  width: 3.1px;
}

.class3-2 {
  width: 3.2px;
}

.class3-3 {
  width: 3.3px;
}

.class3-4 {
  width: 3.4px;
}

.class3-5 {
  width: 3.5px;
}

.class3-6 {
  width: 3.6px;
}

.class3-7 {
  width: 3.7px;
}

.class3-8 {
  width: 3.8px;
}

.class3-9 {
  width: 3.9px;
}

.class4-0 {
  width: 4.0px;
}

.class4-1 {
  width: 4.1px;
}

.class4-2 {
  width: 4.2px;
}

.class4-3 {
  width: 4.3px;
}

.class4-4 {
  width: 4.4px;
}

.class4-5 {
  width: 4.5px;
}

.class4-6 {
  width: 4.6px;
}

.class4-7 {
  width: 4.7px;
}

.class4-8 {
  width: 4.8px;
}

.class4-9 {
  width: 4.9px;
}

.class5-0 {
  width: 5.0px;
}

file1.txt

@for $i from 0 through 50 {
  $v1: floor($i / 10);
  $v2: $i % 10;
  .class#{$v1}-#{$v2} {
    width: #{$v1 + "." + $v2}px;
  }
}

file2.txt

$v1: floor($i / 10);

file3.txt

@for $i from 0 through 50 {
  $v1: floor($i / 10);
  $v2: $i % 10;
  .class#{$v1}-#{$v2} {
    width: #{$v1 + "." + $v2}px;
    comment: #{$i + 1}回目 // これは分かりやすくするためのコメントです
  }
}