css:将图像链接到 url

标签 css image imageurl

我有点困惑,想知道如何将我的图像链接到每个页面中的 url。让我解释一下。我实际上有这个网站结构:

                                                    ------> folder1-1 
                                    ------> folder1 ------> folder1-2
                                                    ------> folder1-3

                                                    ------> folder2-1 
www.domain.com ------> main folder  ------> folder2 ------> folder2-2
                                                    ------> folder2-3

                                                    ------> folder3-1 
                                    ------> folder3 ------> folder3-2
                                                    ------> folder3-3

当我开始链接每个页面中的图像时,情况发生了变化;我的意思是我必须修改 url 目标。例如,主文件夹可以直接从源中获取图像,因此 url 将如下所示 "../images/bla.jpg"

然而,我走得越远,它就越长;即:for folder2 : "../../images/bla.jpg" 等等其他...

我的图像文件夹位于放置主文件夹的根目录中,因此它们彼此平行。

我找到了 4 种方法来解决这个问题:

1- 将完整的 url 直接放置到链接中;即:“http://www.domain.com/images/bla.jpg”(我还不知道这是否会影响网站速度;是否会减慢速度)

2- 疯狂地添加 ../../../ 我在网站中走得更远(我认为这毫无意义。

3- 使所有文件夹“彼此平行”,这样所有文件夹都放在根目录中,图像文件夹可以直接传递到每个页面。

4- 使用外部 css 文件包含每个页面所需的所有图像(但我认为我必须使用完整的 url 将其连接到每个页面或相同的长 ../../../ 方式)

现在我的问题是,我可以使用具有原始结构的图像,而不会直接将内容弄乱到每个页面并且不添加完整的 url 吗?

谢谢

最佳答案

是的,您应该能够使用前导斜杠来表示请求从域的根开始。所以 /images/bla.jpg 将转换为 http://www.domain.com/images/bla.jpg 无论嵌套有多深。

作为旁注,点号 1,使用 http://www.domain.com/images/bla.jpg,不会影响任何速度方式。无论 URL 的措辞如何,它都会被浏览器分解并以相同的方式发送。

关于css:将图像链接到 url,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9644960/

相关文章:

jquery - 为横幅创建响应式 div

html - 为什么我在访问 html 和 css 类时遇到问题

html - 如何隐藏图像上的线性背景?

ruby-on-rails - 如何防止tinyMCE修改rails中的图像URL

javascript - 显示来自图像 uri 的图像

javascript - 仅在执行前一条语句后才开始的语句

html - 字间距在 safari 中不起作用

javascript - 将图像添加到 react 状态以在自定义下拉列表中显示

Java - getImage 和drawImage 不适用于本地文件

java - 匹配所有 URL,排除 jpg、gif、png