关于h5中图片不显示的问题之绝对路径和相对路径

刚入坑前端，在学习的过程中遇到了一个h5中背景图片不显示的问题。经过各种测试一直无法解决，后来灵机一动，发现原来是路径的问题。
我当时的目录分层就是html文件，css文件夹，image文件夹和js文件夹。由于css和image在同一级别的目录中，所以在css中设置背景图片是采用image/xx.jpg是无法显示的。
解决办法：采用相对路径：../image/xx.jpg即可显示背景图片。
后来又总结了一下相对路径和绝对路径的概念。
绝对路径：所谓绝对路径就是文件的真实路径，通过绝对路径可以直观的得到文件所在的目录信息。比如：一个图片在D盘下的image文件夹中，那么它的绝对路径就是：D:/image/xx.jpg
相对路径：所谓相对路径就是相对于自己目标文件的位置。比如说：在css文件中的css文件中引用了image文件夹中的图片，那么改图片的相对路径就是../image/xxjpg。其中../表示上一级目录。
总结来说：绝对路径是从文件的根目录开始一直到该文件的目录；相对路径是以所在目录为基础延伸出来，找出所用文件的路径。
所以当我们在引用一些文件时，最好的选择是使用相对路径，这样当目录结构不变时依然可以正常引用。如果使用绝对路径当资源目录变化时，就会导致资源无法引用的问题，比如：图片从D盘迁移至E盘时，在使用绝对路径的情况下就无法正常显示。