Linking a CSS file on a sub-directory of a parent directory in HTML

Sometimes, for a better organized file system of a web design, I need to create some sub-directories and put those files that belonged to the same category into the same directory.

For example, this is the file structure of my HTML website:

+--- html_publish/
|   +--- images/
|        pic01-IMG_0584.JPG
|        pic02-IMG_0585.JPG
|
|   +--- photo01/
|        detail01.html
|        detail02.html
|
|   +--- saturn/
|       +--- css/
|            custom.css
|
|   +--- templated-radius/
|       +--- css/
|            main.css
|
|   index.html
|   photo01.html
|

  
The file details01.html is located under the subdirectory photo01. 

In Linux shell terminal, the path is:

~/html_publish/photo01/details01.html

If I want to link the CSS style that located in

~/html_publish/templated-radius/css/main.css. 

To link the CSS file (main.css) from detail01.html, I need to go up to one parent directory (html_publish), and then go down to templated-radius sub-directory and then go down to css sub-directory. In the details01.html file:
~/html_publish/photo01/details01.html

<link rel="stylesheet" href="../templated-radius/css/main.css" />

The "two dots" (../) means go up one directory. In some circumstances, if I want to go up 2 levels of directory I can do (../../).

Similarly, I want to link an image file that is located under the sub-directory images of the parent directory.
Images file:

~/html_publish/images/pic01-IMG_0584.JPG

And the HTML file detail01.html is located under the photo01 sub-directory.
HTML file:

~/html_publish/photo01/details01.html

If I want to link the image file, for the <img> tag in details01.html:
~/html_publish/photo01/details01.html

<img src="../images/pic01-IMG_0584.JPG" alt="" />

Reference:
How do I actually link a CSS stylesheet to a HTML sheet?
https://www.codecademy.com/en/forum_questions/553bcfc6d3292f7e1b000760