codecamp

Stylus url()

函数之url()

内联Data URI图像

Stylus捆绑了一个可选函数,名叫url(),其替换了字面上的url()调用(且使用base64 Data URIs有条件地内联它们)。

示例

通过require('stylus').url该函数本身是可用的,其接受一个options对象,当看到url()时候,返回Stylus内部调用的函数。

.define(name, callback)方法指定了一个可被调用的JavaScript函数。在这种情况下,因为我们图片在./css/images中,我们可以忽视paths选项(默认情况下,会查找相关要呈现的图像文件)。如果愿意,该行为时可以改变的。

stylus(str)
  .set('filename', __dirname + '/css/test.styl')
  .define('url', stylus.url())
  .render(function(err, css){

  });

例如,想象图片在./public/images, 我们想要使用url(images/tobi.png), 我们可以传递paths公共目录。这样,它就成为了向上查找进程的一部分。

同样,如果我们想替换为url(tobi.png), 我们可以传递paths: [__dirname + '/public/images'].

stylus(str)
  .set('filename', __dirname + '/css/test.styl')
  .define('url', stylus.url({ paths: [__dirname + '/public'] }))
  .render(function(err, css){

  });
选项(Options)
  • limit 大小默认限制30Kb(30000)
  • paths 图像解析路径


Stylus 迭代
Stylus CSS字面量
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }