From: stackoverflow.

Use liquid:

{% capture lvl %}{{ page.url | append:'index.html' | split:'/' | size }}{% endcapture %}
{% capture relative %}{% for i in (3..lvl) %}../{% endfor %}{% endcapture %}

This:

<link href="{{ relative }}css/main.css" rel="stylesheet" />
<script src="{{ relative  }}scripts/jquery.js"></script>

Becomes this:

<link href="../../../../../css/main.css" rel="stylesheet" />
<script src="../../../../../scripts/jquery.js"></script>

Trying this in practice:

a javascript file

a css file