Solved

path of image file in css

Posted on 2014-09-04
8
183 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 82

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 82

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 82

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
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

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 82

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 82

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

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

747 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

12 Experts available now in Live!

Get 1:1 Help Now