bg-image($url)  // 建立bg-image($url)函式
   background-image: url($url + "@2x.png")
   @media(-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3)
     background-image: url($url + "@3x.png")

2.編寫html程式碼

<div class="title">
  <span class="brand"></span
 
>
  <span class="name"></span>
</div>
<style lang="stylus" rel="stylesheet/stylus">
  @import "../../common/stylus/mixin.styl"   //引用mixin.styl檔案
  .brand
  display: inline-block
  width: 30px
  height: 18px
  bg-image('brand')  // 使用bg-image($url)函式 $url為變數：brand
  background-size: 30
 
px 18px
  background-repeat: no-repeat
</style>

註釋

  bg-image('brand')中 brand為/header/brang.@2x.png || brang.@3x.png的圖片名
/header/brang.@2x.png || brang.@3x.png為檔案路徑

此處使用stylus語法