HTML 文件路径

最新推荐文章于 2023-09-26 22:11:17 发布
最新推荐文章于 2023-09-26 22:11:17 发布
阅读量658 收藏
点赞数
分类专栏： html 文章标签： javascript 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/thgj0006/article/details/129441267
版权

路径描述
<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) 或未来的公共域中均可正常工作。

                

        

        

    




    

      

        

            

              
                
                  thgj0006
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                      0
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    0
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
                
  • 
                  
                    打赏
                    
                  
                  
    打赏
    
                
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
HTML相对路径的写法

				
			

			

				

					天天向上
				

				

					12-16
					
					2592
					
				

			

		

		

			
				
今天写ＨＴＭＬ的时候，发现自己写的ｓｒｃ路径并不能成功显示图片。
文件是这样放的：
　
代码是这样写的：
<img alt = "1观察波形.png" src = "/实验一/1观察波形.png"</img>

得到的结果是这样子的：

　　后来尝试了好久，看了这个说明：
　　https://jingyan.baidu.com/article/2c8c281d805f800008252ad7.html
　　实例中有以下情况：
　　１．图片ｐｉｃ．ｐｎｇ和网页Ｈｉ．ｈｔｍｌ在同一文件夹里。　

			
		

	



                

              
                



	

		

			

				
					
HTML中图片的路径

				
			

			

				

					li12632的博客
				

				

					06-26
					
					5416
					
				

			

		

		

			
				
1、相对路径分同一级路径和上一级路径、下一级路径。 
 
2、绝对路径就是指图片在电脑上的绝对位置，通过这个位置可以直接查到图片C:\Users\20946\Pictures\Saved Pictures或者完整的网络地址图片的搜索结果_百度图片搜索 (baidu.com)https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=%E5%9B%BE%E7%89%87&hs=0&pn=0&spn=0&di=710813568191797

			
		

	



                


  
              

                


	

		

			

				
					
HTML详细基础（二）文件路径

					
最新发布

				
			

			

				

					前端，算法，MATLAB，统计学爱好者，目前主攻Web全栈+考研内容
				

				

					09-26
					
					1983
					
				

			

		

		

			
				
格式一定要保证对，实现跳转的元素使用href属性，id名前加#号；而目的地需要用id属性标识名称。非常重要的标签，在日常接触的各种网页或web应用程序中，每一个跳转界面的功能都由该标签实现~href属性规定了a标签所跳转到的路径。内部链接：（也可以跳转到项目内部的网页）——而并不是相对于某一物品而言的。下载链接——点击后下载目标文件。空链接——实际开发中的暂略方式。实现跳转的目标（按钮 ）

			
		

	





	

		

			

				
					
HTML的src路径怎么设置

				
			

			

				

					十三月的博客
				

				

					04-11
					
					5302
					
				

			

		

		

			
				
HTML的src路径怎么设置



1、*html文件跟*.jpg文件(f盘)在不同目录下：

<img src="file:///f:/*.jpg" width="300" height="120"/>

2、*.html文件跟*.jpg图片在相同目录下：

<img src=".*.jpg" width="300" height="120"/>;

3、*.html文件跟*.jpg图片在不同目录下：

a、图片*.jpg在im...

			
		

	



		

			
		



	

		

			

				
					
html 的相对路径和绝对路径

				
			

			

				

					weixin_62332711的博客
				

				

					02-18
					
					4253
					
				

			

		

		

			
				
图片的话，就要先 ../ 退出 test 文件夹（回到上一级目录）；退出 test 文件夹后。同级的 test 文件夹，通过 / 找到 test 文件夹下一级目录的。①所以我的 src 图片路径为：test/小女孩.jpg。1.2.路径前面加 ./，代表当前（同级）目录。图片在 test 文件夹里面；②的意思和①的意思一样，./ 代表同级目录；图片同级了，然后就就可以直接找到同级的。在 test 文件夹内，如果我要找到。②./ 代表当前目录，所以也可以用。代表当前（同级）目录下的。图片是在同一个目录；

			
		

	





	

		

			

				
					
html 中src引用文件的路径问题

				
			

			

				

					taishuke的博客
				

				

					12-23
					
					3235
					
				

			

		

		

			
				
在编写web应用的时候，难免会在一个文件中引用外部的文件，例如样式表css文件以及一些脚本js文件，这样做的目的无疑是提高代码的复用率。但是在引用文件时，一定要引用正确的文件路径，不然是访问不到相关文件的。
总结一下，一共有如下几种方式引用相关文件：
前提：
相关目录结构：

方法一：使用相对于当前文件（源文件）的相对路径
<link type="text/css" rel="stylesh...

			
		

	





	

		

			

				
					
html中的src路径怎么写,HTML src路径的用法

				
			

			

				

					weixin_32301287的博客
				

				

					05-31
					
					5582
					
				

			

		

		

			
				
前段时间，被一个Web静态服务器的目录问题搞混淆了，后来尝试了几次，总结在这里给有需要的同学。我用的是Express，使用了它的静态目录的功能(类似apache https的静态目录服务)，将一个目录  product/, image/ 给外部直接访问，我的目录结构为：/static/||__product/|    ||    |__index.html||__image/|   ||   |_...

			
		

	





	

		

			

				
					
python输出当前目录下index.html文件路径的方法

				
			

			

				

					09-22
				

			

		

		

			
				
3. 使用`os.path.join()`函数将上一步得到的目录与文件名`'index.html'`组合成完整的文件路径。`os.path.join()`是安全地连接路径部分的函数，它会根据操作系统的类型自动添加适当的路径分隔符。  结合以上步骤，...

			
		

	





	

		

			

				
					
HTML使用相对路径获取各级目录下文件方式详解

				
			

			

				

					01-19
				

			

		

		

			
				
整个文件的完整路径，比如X:\www\web\index.html，或者 http://waldo.com.cn/index.html 。这两者都属于绝对路径。 相对路径多种使用方式详解 假设当前有一个页面，要链接到一个页面名称为test.html的页面，以下展示...

			
		

	





	

		

			

				
					
EnumerationList:此存储库包含用于子域枚举的字词列表，php文件路径，html文件路径和js文件路径

				
			

			

				

					03-31
				

			

		

		

			
				
此存储库包含用于子域枚举的字词列表，php文件路径，html文件路径和js文件路径 庞大的780万列表，外加用于子域枚举的唯一单词。  非常感谢Emad Shanab的贡献。 我刚刚根据扩展名对单词表进行了分隔，以进行特定的...

			
		

	





	

		

			

				
					
html插入图片img中的src图片路径（相对路径和绝对路径）

					
热门推荐

				
			

			

				

					m0_52118763的博客
				

				

					02-26
					
					3万+
					
				

			

		

		

			
				
1相对路径

1同一级目录
<img src="1.jpg" \>
2下一级目录
3.jpg路径------web\images\3.jpg
1.html路径-----web\1.html
<img src="images/3.jpg" \>

3上一级路径
demo1.html----路径web\html\demo1.html
2.jpg-------路径web\2.jpg
<img src="../2.jpg" \>

如果要返回上一级的上一级
<img src

			
		

	





	

		

			

				
					
利用html5读取本地文本文件及图片文件

				
			

			

				

					cnds123的专栏
				

				

					09-25
					
					2万+
					
				

			

		

		

			
				
利用html5可以对本地的如文本、图片等文件读取操作，html5定义了一个file对象类型来表示文件，每个file对象对应一个文件。file对象有3个属性：name、size、type。name是不包含路径的文件名，size是以字节为单位的文件体积大小，type则是文件的MIME（例如image/jpg，关于MIME 参考手册 参见https://www.w3school.com.cn/media/media_mimeref.asp）。



			
		

	





	

		

			

				
					
HTML学习笔记

				
			

			

				

					weixin_48495158的博客
				

				

					08-24
					
					289
					
				

			

		

		

			
				
学着玩

			
		

	





	

		

			

				
					
html 绝对路径和相对路径

				
			

			

				

					onebumps的博客
				

				

					11-23
					
					926
					
				

			

		

		

			
				
我们在学习html时总会进行各种的文件操作，或是插入图片，或是引入css，所以我们有必要了解绝对路径和相对路径问题。

			
		

	





	

		

			

				
					
html利用a标签实现下载本地的文件

				
			

			

				

					榕城候佳人的博客
				

				

					12-23
					
					1万+
					
				

			

		

		

			
				
在写html页面的时候，需要在网页上提供一个下载按钮可以下载我自己电脑中的文件。我已经知道了该文件的路径，但是之前看了很多文章都没找到正确办法，一直不知道如何能够下载本地的文件，经过不断实验发现，可以利用a标签中的downlo属性，同时将href属性设置为文件的路径，注意：该路径对html页面来说是相对路径。

			
		

	





	

		

			

				
					
HTML图像标签和相对路径及绝对路径

				
			

			

				

					m0_62452636的博客
				

				

					04-13
					
					5575
					
				

			

		

		

			
				
下一级路径如下：因为我们只引用一张图片，所以只需要images文件下的某一文件，假设需要bg.gif文件。那么bg.gif文件就是Html文件的下一级。由于页面图片很多，我们通常新建一个文件夹存放图像文件，此时查找图像需要采用路径的方式来指定图像文件的位置。Src是标签的必须属性，它用于指定图像文件的路径和文件名。同一级路径：如果html文件与所要引用的图像文件在同一文件夹下，则为同一级路径。目录下的绝对位置，直接到达目标位置，通常是从盘符（c盘、d盘）开始的路径。Img为图像image缩写。

			
		

	





	

		

			

				
					
html怎么打开本地文件,HTML怎么打开本地文件

				
			

			

				

					weixin_31423955的博客
				

				

					06-11
					
					1万+
					
				

			

		

		

			
				
2 回答回答：androID 浏览器打开本地HTML文件的方法有些HTML文件放在本地磁盘和sdcard，如何用打开这个网页呢？这种应用在测试时非常有用。有2个方法：1.　使用文件管理器如ES等，需要幸运的是你的文件管理器直接用浏览器打开。2.　在浏览器输入地址访问本地磁盘和SD卡上的HTML，前部分content://com.androID.HTMLfilePRovIDer是ProvIDer的标...

			
		

	





	

		

			

				
					
html路径和链接

				
			

			

				

					qq_46022199的博客
				

				

					05-02
					
					633
					
				

			

		

		

			
				
vscode

			<!DOCTYPE html>文档类型声明标签，告诉浏览器这个页面采取html5版本来显示页面

			

			<html lang="en">告诉浏览器或者搜索引擎是一个英文网站，本页面采取英文来显示

			

			<meta charset="UTF-8">采取 UTF-8 来保存文字 不写会乱码

			
...

			
		

	





	

		

			

				
					
html中图片保存src路径总结

				
			

			

				

					Abigail路小雨的博客
				

				

					03-17
					
					2114
					
				

			

		

		

			
				
1、如果html文件和图片在同一文件目录下

``
2、如果图片在img文件夹里  而html文件与img在同一文件目录下

`` 
3、如果 图片在images文件夹  html文件在count文件夹下  而images和count在同一目录下

 <img src="../images/1.jpg" width="140" height="140">
 
4、html文件跟图片在不...

			
		

	





	

		

			

				
					
python调用html文件路径,python 文件路径

				
			

			

				

					05-17
				

			

		

		

			
				
# HTML文件路径 html_file = "path/to/file.html"  # 使用默认浏览器打开HTML文件 webbrowser.open(html_file, new=2) ```  至于Python文件路径，您需要提供更多的信息，比如您想要做什么。一般而言，可以使用Python...

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  





	
打赏作者

	

		

		
			
		
		

		

			
thgj0006

			
你的鼓励将是我创作的最大动力

		

	

	

			

	

	

    ¥1
    ¥2
    ¥4
    ¥6
    ¥10
    ¥20
	

	

		

			

				

					扫码支付：¥1
				

				

					

					
					获取中
					

				

				

					
					
					扫码支付
				

			

		

		

			
您的余额不足，请更换扫码支付或充值

			
打赏作者

		

	



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值