HTML image src case sensitivity

问题

I have image folder names in caps. But the src is in lowercase, so this is not loading images.

I can't make all the image folders lowercase, so I want to change my code to take a case insensitive path.

I have a link like this:

<a href="http://www.google.com">
  <img id="productMainImage" src="images/Tulips.jpg" alt="image" escapeXml="false" class="product_main_image"/>
</a>

I want to make the image src as case insensitive; meaning I want my code to work even if src ="IMAGES/Tulips.jpg".

How to resolve this issue?

回答1:

Either you can use JS to do this using toLowerCase(), or you need to rename them by yourself.

Also, it depends on the server, and HTML has nothing to do with this, UNIX Servers are case sensitive, whereas Microsoft servers are case insensitive.

Also if you are using any server side language, like PHP, you can use strtolower() as well which would be even better, as client can have JavaScript turned off in which, your page will fail to render images.

回答2:

This really depends on what OS your web server is running - for example OSX is not case sensitive on the file system but Linux is.

You could create a regex to rewrite the request - apache offers mod_rewrite - but I find it best to create a convention and stick to it - I assume things will be case sensitive so that if I port the site I do not have any issues.

回答3:

I think you can use .htaccess and RewriteRule to change the path on request. Something like this:

RewriteRule ^IMAGES/(.*)\.(jpg|jpeg|gif|png)$ images/$1.$2

来源：https://stackoverflow.com/questions/21698655/html-image-src-case-sensitivity