Solved

path of image file in css

Posted on 2014-09-04
8
187 Views
Last Modified: 2014-09-05
Hi,

What is the difference between using /, ../ and ./?
I have a folder structure
project
     src
     webapp
             js
               css1
                        images3
           css2
            images1
            style1    
                    css1
                          a1.css

what is the best way to refer images in images1 folder from a1.css ?
0
Comment
Question by:Rocking
  • 5
  • 3
8 Comments
 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 40305040
Here http://en.wikipedia.org/wiki/Path_%28computing%29 is probably more than you wanted to know.  '/' is your home directory.  In a web site this can mean your web site home directory and not your user home directory.  './' is the current directory and '../' is the next higher directory in the current path.
0
 
LVL 83

Assisted Solution

by:Dave Baldwin
Dave Baldwin earned 500 total points
ID: 40305042
The most reliable way to refer to the images1 directory is "/project/ webapp/images1/img.jpg" because that path starts at the root of your directories and will always work from anyplace in your paths and directories above.
0
 

Author Comment

by:Rocking
ID: 40305884
What is the difference between using /, ../ and ./?

can i make ""/project/" as dynamic?
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40306523
can i make "/project/" as dynamic?
What does that mean?  Whatever you use for a 'path' to a file has to match what is actually on the server.
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 

Author Comment

by:Rocking
ID: 40306563
suppose the name of the project changes then if i have hardcoded the project name,then it needs to be changed manually.
like in jsp we get teh context path same way can we get in css also? If yes then how?

If we can't get the context name in css file then the approach ../ would be much better as the project name changes we don't need to modify the project name in css file.
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40306640
CSS is entirely passive, it is a description language but not a programming language.  Some other language would have to change the 'project' name because there is nothing in CSS that can do that.
0
 

Author Comment

by:Rocking
ID: 40307142
ok it means that there are no ways in which we can pass the project name in the css file.

It means that the approach ./ will be the best if we need dynamic folders.

Can u please let me the know the difference between "using /, ../ and ./?"

Out of the tree which one is better ot use
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40307151
The three methods, " /, ../ and ./", are not interchangeable, they are used for different things.  Usage depends on the need and where the file is in the path structure.  See my first comment for details.
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Button Css BootStrap 2 33
eclipse shortcuts 9 45
How can i create a customized Login page based on Wordpress ? 8 27
servlet filter example 37 37
Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
This tutorial covers a practical example of lazy loading technique and early loading technique in a Singleton Design Pattern.

914 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now