title: <base> tag for CSS url()
body: <p>I'm looking for a way to reference with <code>/</code> a "custom" url. I'm using something like a local browser and the <code>/</code> path references to / unix path (yea, o.s. root path!), which is definitely not the same place where my files are placed.</p>
  
  <p>While I can solve this in html with <code>&lt;base&gt;</code> I don't understand if this works for CSS url() too or if there is something similar that allows me to specify full urls.</p>
  
  <p>I'm open to any solution at this point, even using SASS with some custom function that will rewrite any url replacing it with the full path.</p>
  
  <p>To clarify more what I'm asking, here is an example of my issue and how I would like to solve it:</p>
  
  <pre><code>/mnt/projects/web/myproject/index.html
  
  ...
  &lt;base href="/mnt/projects/web/myproject/" /&gt;
  ...
  
  /mnt/projects/web/myproject/style.scss
  
  $base_url: "/path_to_root_folder_dinamically_fetched_on_client_pc/";
  body
  {
    background-image: url("#{$base_url}mydir/myimage.png");
  }
  </code></pre>
  
  <p>The best option is obviously if <code>url(/mydir/myimage.png)</code> works, but reading through the net I understood it doesn't.</p>
  
  <p>Thanks for any suggestion.</p>
  
  <p><strong>Update 1:</strong></p>
  
  <p>Sorry, the answers are both good but without context, it's hard to answer to this question.
  Let me explain a bit more: I'm using a software (<a href="https://github.com/rogerwang/node-webkit" rel="noreferrer">node-webkit</a>) to run a "website" (well, it's an app), locally. This is more or less a custom chromium instance with some additional features.</p>
  
  <p>The biggest problem is that node-webkit uses the file:/// protocol, so yes, the root path for file protocol IS actually the root of your o.s., C:/ on windows, / on unix systems and it's not directly an issue because this is a local application (the user must have installed it in some way, I already had access to this system).</p>
  
  <p>The secondary problem is that when you package the application into a single file, when the user runs it, it is unpacked in a temp directory to actually run the website through the file:/// protocol, something like /tmp/randomnumber/index.html</p>
  
  <p>Because of this, using <code>/</code> it's not a valid option, however because my stylesheets are spread enough (it's a complex app, I have something like layouts/something.css main.css and similar things), it's a big issue having to rewrite always the ../ for every url.</p>
  
  <p>What options do I have? In this case, the javascript option is not that bad as you may think. The other idea was running a <strong>really small webserver</strong>, which should only serve static things, but this needs to be portable, cross-platform and shouldn't need install.</p>
  
  <p>I thought it was possible to solve this with basic html and CSS, but it looks like it's not, while I can add "base" tag dinamically through javascript, there isn't something similar for CSS.</p>