CODEWITHSUNDEEP
htmlcssadobe-brackets
plast1cd0nk3y
plast1cd0nk3y

Reputation: 428

My code in Brackets is not reading the files I call

I have a bunch of folders on my desktop (working on a Mac) and I am trying to call various files into my style.css file and index.html files. Rather than trying to post a complicated explanation of all my directories/code, could someone please explain to me how calling files into my code works? How do file tree hiearchies work in ? For example, if I have three folders:

If my index file is in Folder A, and I want to call the cat image, do I write Folder A/ Images/ cat.jpg or do I only need to write Images / cat.jpg ?

And to call items outside of Folder A, so in Folders B and C, do I need to do anything in in order for to understand where these folders are located? As an example, I was trying to call my style.css sheet into my index.html file. I did so by simply writing Folder C/ MoreCode/ style.css. I also double clicked my style.css sheet to add it to my working file list in Brackets. However, my style sheet still was not being read by my html file.

Upvotes: 2

Views: 388

Answers (2)

dt.k
dt.k

Reputation: 43

The directory structure works from the file(s) current location. For instance, if your index.html file is in the following location:

Parent Folder/Folder A/Code/index.html

And you want to call the cat image, you would use the following path:

../Images/cat.jpg

../ - Move out of the current directory (Code), back to the previous directory (Folder A).

Images/ - Look for a directory called Images.

cat.jpg - Display the cat.jpg image.

Likewise, to load your stylesheet, you would need to move back two directories. Out of the current directory Code/, then out of the Folder A/ directory, back to the Parent Folder/ directory. So you would use:

../../Folder C/MoreCode/style.css

I would also remove the whitespace from your directory names as this can cause issues, so instead of Parent Folder/Folder A/, change it to ParentFolder/FolderA/.

Upvotes: 1

Deep Patel
Deep Patel

Reputation: 33

<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

To call your styles sheet since it is 2 levels down add the period period three times and then / then name of folder and your style sheet name.

Straight from W3schools: https://www.w3schools.com/html/html_filepaths.asp

Upvotes: 0

Related Questions