今天還是想想不到寫啥，所以只能又來繼續騙天數囉，今天就是會把原本筆記上面的東西，沒有提到部分記錄在這一邊以後讓自己有印象比較好查詢，今天在設定新專案的RWD斷點，立刻就用上鐵人賽的文章內容，今天就偷懶把一些比較雜項的項目紀錄上來，一些文字管理的方式，由於今天是筆記形式有些說明就寫在註解裡面。

//編譯前
@mixin fs2($size: 16px, $base: 16px) {
  font-size: $size;
  font-size: ($size / $base) * 1rem;
}
//如果不要裝套件可以透過這樣轉換有rem單位的方式
p {
  @include fs2(24px);
}

//文字大小管理專用
$font: 12px 16px 24px;//數字的陣列
$font-default-level: 2;//預設值

@function px2rem($size, $base: 16px) {
  @return $size / $base * 1rem;
}

@function pxlh($size, $line-padding: 2px) {
  @return $size + $line-padding * 2;
}

@mixin font($level: $font-default-level) {
  @if $level < 1 or $level > length($font) {
    $level: $font-default-level;
  }
  $size: nth($font, $level);
  font-size: $size;
  font-size: px2rem($size);
  line-height: pxlh($size);
  line-height: px2rem(pxlh($size));
}
//如果使用數字的陣列超過，使用第五個值，我們陣列裡面沒有第五個值，這時候就會選到default的選項

h1 {
  @include font(5);
}

//編譯後
p {
  font-size: 24px;
  font-size: 1.5rem;
}

h1 {
  font-size: 16px;
  font-size: 1rem;
  line-height: 20px;
  line-height: 1.25rem;
}