搜尋

首頁  >  問答  >  主體

node.js - sprity的gulp插件margin设置问题?

插件地址:sprites

gulp.task('sprites', function() {
    return sprity.src({
            src: './src/images/icon/**/*.{png,jpg}',
            style: './_icon.scss',
            margin: 20,
            orientation: 'left-right',
            processor: 'css',
        })
        .pipe(gulpif('*.png', gulp.dest('./src/images/'), gulp.dest('./src/sass/')))
});

配置了margin:20 生成的background-position位置会不准,设置成margin:0能正常。

PHPzPHPz2866 天前599

全部回覆(1)我來回復

  • PHPz

    PHPz2017-04-17 13:59:14

    {{#each layouts}}
      {{#each sprites}}
    
        {{#if dpi}}
        @media (-webkit-min-device-pixel-ratio: {{ratio}}), (min-resolution: {{dpi}}dpi) {
        {{/if}}
        .icon {
          background-image: url('{{escimage url}}');
          {{#if dpi}}
          background-size: {{width}} {{height}};
          {{/if}}
        }
        {{#if dpi}}
        }
        {{/if}}
      {{/each}}
    
      {{#each layout.items}}
      .{{../classname}}-{{meta.name}} {
        background-position: (-{{x}}px - 20) (-{{y}}px - 20);
        width: ({{width}}px - 40);
        height: ({{height}}px - 40);
      }
      {{/each}}
    {{/each}}

    加了個這個正常了,好像需要配置.hbs模板

    回覆
    0
  • 取消回覆