Whenever porting a HTML template to ASP.NET MVC Core view we have to keep in mind that the path for resources like image , css , scripts should always be coded with '/' before the folder name . For Example -
If you have a template named Clanstech with folder structure as mentioned in below image.
With code in about.html will be like
<link rel="stylesheet" href="assets/css/aos.css">
In order to use the above css file in ASP.NET MVC Core project with the following structure
We will have to use the following code
<link rel="stylesheet" href="/assets/css/aos.css">
If we dint add '/' before assets folder then it will not load the css file if the user is on suppose /localhost:876/Home/About action/page/view.
To get more idea how file path works , below is the correct usage as shown on this link also https://www.w3schools.com/html/html_filepaths.asp
HTML File Paths
<img src="picture.jpg"> |
picture.jpg is located in the same folder as the current page |
<img src="images/picture.jpg"> |
picture.jpg is located in the images folder in the current folder |
<img src="/images/picture.jpg"> |
picture.jpg is located in the images folder at the root of the current web |
<img src="../picture.jpg"> |
picture.jpg is located in the folder one level up from the current folder |
d2435b6f-6b9f-47f2-afe6-871e87c37636|0|.0|96d5b379-7e1d-4dac-a6ba-1e50db561b04
ASP.NET MVC Core, HTML5
Porting, HTML, ASP.NET MVC Core