一旦用自己鐘意的方式命名完斷點，就需要有一種方式在實際的媒體查詢中使用它。有太多方法可以做這件事，我自己非常樂意使用?`map-get()`?函數讀取斷點地圖的方法。這套系統簡潔而高效。 ~~~ /// Responsive manager. /// @access public /// @param {String} $breakpoint - Breakpoint /// @requires $breakpoints @mixin respond-to($breakpoint) { $raw-query: map-get($breakpoints, $breakpoint); @if $raw-query { $query: if(type-of($raw-query) == 'string', unquote($raw-query), inspect($raw-query)); @media #{$query} { @content; } } @else { @error 'No value found for `#{$breakpoint}`. ' + 'Please make sure it is defined in `$breakpoints` map.'; } } ~~~ 顯然，這樣管理斷點相當簡單，但當需要自定義或使用多個斷點會愛到一定的制約。 如果你希望能更好管理斷點，我可以建議你使用類似?[Sass-MQ](https://github.com/sass-mq/sass-mq)、[Breakpoint](http://breakpoint-sass.com/)?或[Include-Media](https://github.com/eduardoboucas/include-media)，沒有必要自己重新去造輪子。 ## 擴展閱讀 * [Managing Responsive Breakpoints in Sass](http://www.sitepoint.com/managing-responsive-breakpoints-sass/) * [Approaches to Media Queries in Sass](http://css-tricks.com/approaches-media-queries-sass/)