Menu
When I reference an image or other file in a CSS file by a relative path, is the path relative to the CSS file or the HTML file using the CSS file?
408
When linking to files within the same project, use a relative path. The path is determined by where a file is located within the directory. So in this example, the index file is in the same folder as the css and image files.
A relative path refers to a location that is relative to a current directory. Relative paths make use of two special symbols, a dot (.) and a double-dot (..), which translate into the current directory and the parent directory. Double dots are used for moving up in the hierarchy.
The difference between relative and absolute paths is that when using relative paths you take as reference the current working directory while with absolute paths you refer to a certain, well known directory.
A path is either relative or absolute. An absolute path always contains the root element and the complete directory list required to locate the file. For example, /home/sally/statusReport is an absolute path. All of the information needed to locate the file is contained in the path string.
Yes, it's relative to the .css
Here's an example layout:
Page: page.htm ... does not matter where CSS: /resources/css/styles.css Image: /resources/images/image.jpg CSS in styles.css:
div { background-image: url('../images/image.jpg'); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
