codecamp

HTML 文件路径

路径 描述
<img src="logo.jpg"> logo.jpg 位于与当前网页相同的文件夹
<img src="logo/logo.jpg"> logo.jpg 位于当前文件夹的 logo文件夹中
<img src="/logo/logo.jpg"> logo.jpg 位于当前站点根目录的 logo 文件夹中
<img src="../logo.jpg"> logo.jpg 位于当前文件夹的上一级文件夹中

HTML 文件路径

文件路径描述了网站文件夹结构中某个文件的位置。

文件路径会在链接外部文件时被用到:

  • 网页
  • 图像
  • 样式表
  • JavaScript

绝对文件路径

绝对文件路径是指向一个因特网文件的完整 URL:

实例

<img src="https://www.w3cschool.cn/statics/img/logo/indexlogo@2x.png" alt="Logo">

<img> 标签以及 src 和 alt 属性在 HTML 图像这一章做了讲解。

相对路径

相对路径指向了相对于当前页面的文件。

在本例中,文件路径指向了位于当前网站根目录中 logo 文件夹里的一个文件:

实例

<img src="/statics/img/logo/indexlogo@2x.png" alt="Logo">

在本例中,文件路径指向了位于当前文件夹中 logo 文件夹里的一个文件:

实例

<img src="statics/img/logo/indexlogo@2x.png" alt="Logo">

在本例中,文件路径指向了位于当前文件夹的上一级文件夹中 logo 文件夹里的一个文件:

实例

<img src="../statics/img/logo/indexlogo@2x.png" alt="Logo">

好习惯

使用相对路径是个好习惯(如果可能)。

如果使用了相对路径,那么您的网页就不会与当前的基准 URL 进行绑定。所有链接在您的电脑上 (localhost) 或未来的公共域中均可正常工作。


HTML 总结
HTML 表情符号
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }