html文件路径和目录语法知识

  • 2017-01-25 16:21:10
  • 15,416 次阅读
  • 稿源:天马行空

html文件路径如何正确引用,对于刚接触到html的初学者来说很重要。如果不能正确的引用路径,网页或图片链接地址就会出错,甚至打不开。为了避免这些错误而正确的使用路径,需要学习并掌握html路径的方法及目录语法。

HTML有2种路径方法:相对路径和绝对路径。

(1)绝对路径

假如我们在E盘/绝对路径/html/code建两个源文件index.html和link.html,在index.html里引用link.html文件作为超链接。

那么文件的绝对路径就是如下:

index.html路径就是:file:E:/绝对路径/html/code/index.html

link.html路径就是:file:E:/绝对路径/html/code/link.html

在index.html链接link.html的代码应该这样写:

<a href = “file://E:绝对路径/html/code/link.html”>link.html</a>

其实,我们先应该在link.html文件里写点东西的,比如:“我是绝对路径”几个字,然后在浏览器中打开,点击link.htm超链接就会打开“我是绝对路径”几个字了。

htmlGrammarAandPath

如果把code文件夹移动到D盘,再打开浏览器点击link.html超链接,我们发现找不到“我是绝对路径”这几个字了。因为这个时候会看到浏览器还是file://E:绝对路径/html/code/link.html这个路径,而我们已经把code文件夹移到D盘了,E盘里没有code文件了,所以“我是绝对径”这几个字找不到了。如果把code文件夹再移动到原来的地方,又能正常工作了。所以这种方法有一个问题,当整个文件目录移动到其他的磁盘符时,目录结构发生发生变化,链接就失效了。

(2)相对路径

我们还是利用E磁盘,把“绝对路径”文件夹改成“相对路径”并把index.html源文件里的“我是绝对路径”改成“我是相对路径”几个字,那么文件的路径是:

index.html路径就是:file:E:/相对路径/html/code/index.html

link.html路径就是:file:E:/相对路径/html/code/link.html

在index.html链接link.html的文件可以直接写:

<a href = “link.html”>link.html</a>

打开浏览器点击link.html超链接可以看到“我是相对路径”这几个字,并且浏览器的地址栏会显示file:E:/相对路径/html/code/link.html整个路径目录,也就是说它能识别当前的路径并转换为绝对路径。

假如我们把code文件夹移动到D盘,然后打开浏览器,点击link.html超链接会看到“我是相对路径”几个字,并且浏览器地址栏会显示当前file:D:/code/link.html路径。

因此我们可以看出相对路径的条件是文件包括里面的代码必须都在一个磁盘或者目录下,当在同一个目录下,那直接链接的就是link.html文件。当在同一个主目录下且有多个子目录时,就要使用目录结构法。

(3)目录语法

①同一个目录:link.html或者./link.html;

②在子目录:子文件夹/link.html

③在孙子目录:子文件夹/孙子文件夹/link.html

④在父目录:../link.html

⑤在爷爷目录:../../link.html

⑥在根目录:/link.html

在同一个目录中我们已经实现了,下面在子目录进行操作。当我们在code里新建个“子文件夹”并把link.html移动到里面去,打开浏览器点击超链接会找不到文件。然后代码写成<a href = “子文件/link.html”>link.html</a>这样又能打开了。同理在孙子目录也是这样,依次类推。

在父目录中,我们就是把link.html移动到code文件的上一层文件夹中去,然后把代码改成<a href = “../link.html”>link.html</a>就可以了。同理爷爷目录也是这样,依次类推。

喜欢 9

文章评论 (62)

  1. Feeey个人博客说道:

    进来转转,博主新年快乐。

    [1楼]网友 Windows 7 | Internet Explorer 9.0   
  2. Leonardfoula说道:

    starting a blog to make money step by step

    geek wedding ideas

    [2楼]网友 Windows NT | Chrome 67.0.3396.99   
  3. cukxcduke说道:

    Годнота спасибо

    [3楼]网友 Windows NT | Chrome 68.0.3440.106   
  4. The best sites http://maxing128.com ShaneGraip说道:

    The best sites http://maxing128.com

    [4楼]网友 Windows 7 | Chrome 67.0.3396.87   
  5. Kevinrar说道:

    Люстры, светильники, освещение — купить в интернет-магазине света ВамСвет с доставкой по Москве, Санкт-Петербургу и всей России — фото, цены, отзывы, характеристики https://www.vamsvet.ru/

    [5楼]网友 Windows 7 | Chrome 66.0.3359.181   
  6. palinazhuti说道:

    продажа квартиры в собственности 3 года налог оби каталог товаров в санкт петербурге интернет магазин самокат отзывы
    https://mikheeff.ru/a860 Мясной рулет в сливочно-сырном соусе
    https://mikheeff.ru/a48 Суп молочный из трески с перцем и сельдереем

    [6楼]网友 Windows 7 | Chrome 66.0.3359.181   
  7. Dennisphera说道:

    Реклама в Pinterest самая эффективная https://youtu.be/pKbaZSBLSGE по продажам для интернет магазинов, ebay, etsy, amazon

    [7楼]网友 Windows 7 | Chrome 66.0.3359.181   
  8. enamowgzg说道:

    ничего такого
    _________________
    Как научиться зарабатывать на ставках на спорт

    [8楼]网友 Windows 7 | Chrome 68.0.3440.106   
  9. HarrietMag说道:

    Добрый день.
    Можешь называть меня Геля.
    Познакомлюсь с мужчиной для встречи. Приеду к тебе на район или встримся у меня. Живу совсем близко.

    Профиль онлайн

    [10楼]网友 Windows NT | Chrome 67.0.3396.87   
  10. DelosresSpase说道:

    loan rates
    holiday money
    payday loan
    cash loans
    need a loan

    [11楼]网友 Windows 7 | Chrome 67.0.3396.99   
  11. Jamescycle说道:

    адвокат днепровский район запорожье
    устная и письменная консультация адвоката и юриста в украине

    [12楼]网友 Windows 7 | Chrome 68.0.3440.106   
  12. kolosHiems说道:

    производители люков россия или скрытый люк в ванну

    https://www.lukland.ru/catalog/hatches/hatchesforpaint/removable/alustar/gk1/variant/567

    [13楼]网友 Windows NT | Chrome 67.0.3396.87   
  13. WilmerFlape说道:

    В новомодных реалиях каждый старается находить по максимуму забавные и ультрасовременные видеослоты. Это предоставляет удобный случай не без усилий обыгрывать, а наслаждаться временем. Всё-то, о чем вы к примеру давно мечтали теперь , реализовано на одном интернет-сайте, вот ссылка: https://vulcan-casino24.com/ – онлайн казино Вулкан, которая всех доведет к удаче. Полностью все слоты собраны таким образом, что вы можете активировать более чем достаточно бонусов. В случае если вам интересно, то можете немедленно регистрироваться.

    [14楼]网友 Windows 7 | Chrome 68.0.3440.106   
  14. Vitus_Britva_wrind说道:

    Доброго Всем настроения!

    Смотрите как выиграть 6 из 45 математически 2 цифры https://www.youtube.com/watch?v=dAodC3Q1f3E

    Понравилось: 8465477785 пользователям

    [15楼]网友 Windows NT | Chrome 65.0.3325.146   
  15. HarrietMag说道:

    Добрый день.
    Я Лина.
    Познакомлюсь с мужчиной для встречи. Приеду к тебе на район или встримся у меня. Живу недалеко.

    Подробнее

    [16楼]网友 Windows NT | Chrome 67.0.3396.79   
  16. Russellwenty6说道:

    Подскажите пожалуйста, где скачать взломанную версию игры Cookie Clickers для андроид?
    Вот на этом сайте она есть, но версия игры уже устарела, а я ищу последнюю версию с модом.

    [17楼]网友 Windows NT | Chrome 68.0.3440.84   
  17. timupzolb说道:

    Огромное тебе СПАСИБО
    _________________
    Привязать карту к фонбет

    [18楼]网友 Windows 7 | Chrome 66.0.3359.181   
  18. Serviceecu说道:

    Привет дамы и господа!
    Наша компания занимается свыше 10 лет ремонтом и обслуживанием оргтехники в городе Минске.Основные направления и виды нашей деятельности:

    1)Заправка и восстановление картриджей

    2)Ремонт и сервис оргтехники

    3)Ремонт и настройка компьютеров и ноутбуков

    4)SEO продвижение сайтов

    5)Разработка сайтов
    Всегда рады помочь Вам!
    заправка картриджей clp 325
    заправка картриджей принтеров samsung
    продвижение сайта в поисковых системах интернета
    оптимизация сайта под seo
    ремонт картриджей xerox

    [19楼]网友 Windows 7 | Chrome 68.0.3440.106   
  19. MichaelUlcen说道:

    301 Moved Permanently

    sharapova
    fart

    [20楼]网友 Windows 7 | Chrome 66.0.3359.181   
  20. Patrgurse说道:

    修复喀山的小屋

    [21楼]网友 Windows NT | Chrome 67.0.3396.87   
  21. KRenoZes说道:

    Our experts are actually will quickly and effectively generate a manufacturer’s warranty Premium improvement New York.

    Our team consistently keep and also improve the stockroom of additional components and also solution documents for functional repair as well as upkeep.

    Likewise in our business, you may order customized shower room narcissisms, renovation interior on the greatest disorders. Along with us, Inner parts redesigns Manhattan, along with Premium redesign manhattan, will certainly become basic, high quality and quick.

    [22楼]网友 Windows 7 | Chrome 67.0.3396.87   
  22. BrianZew说道:

    Не хватает денег до зарплаты на то, что хочется? Заказывай бесплатную карту рассрочки “Совесть” и позволь себе свою мечту! Карта рассрочки “Совесть” здесь

    [23楼]网友 Windows NT | Chrome 67.0.3396.87   
  23. PalkogoGax说道:

    Советуем Пакеты с логотипом москва

    [24楼]网友 Windows NT | Chrome 68.0.3440.75   
  24. MasterWeb si说道:

    Веб мастера Разработка сайтов, разработка web-приложений, верстка витрин магазина и еще тысячиактуальных предложений по срочной работе для тех, кто тесно связан с WEB-IT-деятельностью.У нас всегда публикуются только самые свежие и реальные объявления.Всегда можно найти готовых заказчиков тут , которые желают оплатить вашу работу – это всего несколько минут!
    Создай свой бизнес и получите бесплатно тестовую подписку.

    [25楼]网友 Windows 7 | Chrome 67.0.3396.87   
  25. Keepvidpro818u说道:

    The Best Video Enhancer Software reviews 2020.
    The Best free online YouTubetomp3 tools.
    New flvto website.
    The Best and stable YouTube video Downloader
    New ytmp3 website
    無料かつ強力 なオンラインYouTubeダウンローダー
    Powerful and Fast Online YouTube Downloader
    Free Youtube to mp3.

    [26楼]网友 Windows NT | Chrome 67.0.3396.79   
  26. rimlHiems说道:

    подшипник timken каталог
    cooper подшипники

    http://podshipnik-mo.ru/podshipniki-ina/

    [27楼]网友 Windows NT | Chrome 67.0.3396.87   
  27. smapkwvme说道:

    Супер давно искал

    [28楼]网友 Windows NT | Chrome 67.0.3396.99   
  28. ThomasWag说道:

    Дорогие друзья!

    Букмекерская контора рада представить вам лучший онлайн сервис спортивных ставок в России! Мы предлагаем:

    Высокие коэффициенты!
    Широкую роспись на спортивные события!
    Большое количество способов ввода и вывода денежных средств!
    Круглосуточную поддержку по почте, телефону, чату!
    Большое количество акций для игроков!
    зарегестрироваться

    [29楼]网友 Windows NT | Chrome 64.0.3282.140   
  29. PalkogoGax说道:

    Заводик Пакеты с логотипом дешево

    [30楼]网友 Windows NT | Chrome 65.0.3325.146   
  30. Maramyginshomy说道:

    http://bit.ly/37s3dPW – buy thesis paper ACADEMIC WRITING HAS NEVER BEEN EASIER Every academic writing dilemma can be solved! We write all types of papers in different subject areas from scratch. http://bit.ly/35eCYuX – can i hire someone to write my essay For partners http://bit.ly/2Qebt05 http://bit.ly/2QkRwVw – buy a research paper cheap Order custom essay College writing service Essay editing service reviews a50b03d New iPhone 11 http://trk.adtrk15.com/SHki New iPhone 11

    [32楼]网友 Windows 7 | Chrome 66.0.3359.170   
  31. Stephennon说道:

    Hello!
    Some students think that a college paper is a piece of cake until they actually encounter a term paper. This is when the challenge becomes real and the stakes get high. If you are not determined to do your writing assignments by yourself, you have to seek professional help. You will have a paper writer assigned to you as soon the order form is …

    http://fabriziopolo.com/textcraft/wiki/index.php/User:91.185.2.162

    write my essay generator
    cheap essay papers

    [33楼]网友 Windows 7 | Chrome 68.0.3440.106   
  32. AnthonyJefic说道:

    онлайн полная версия сайта

    ставки на чемпионат россии

    [34楼]网友 Windows NT | Chrome 67.0.3396.87   
  33. XRumerTest说道:

    You Can Deserve Millions spot on now with Bitcoin Billionaire
    https://www.bcoinbillionaire.com/

    [35楼]网友 Windows NT | Chrome 66.0.3359.170   
  34. WayneBal说道:

    Мебельный щит из сосны, бука, дуба, ясеня http://mebelny-shit.ru/ от производителя! Современное оборудование, объемы производства до 200 м3 готовой продукции в месяц. Так же производим тетивы, подступенки, разворотные площадки, поручень, балясины. Организуем доставку в любой регион России, РБ, KZ.

    [36楼]网友 Windows NT | Chrome 65.0.3325.146   
  35. Nicolasfausy说道:

    добрый! я Хотел бы порекомендовать сайт – перейти Отличный сайт для проведения времени. Заходите и смотрите. Переходим к нам на сайт сюда. Сайт для нас

    [37楼]网友 Windows NT | Chrome 65.0.3325.146   
  36. Forelsoack说道:

    Оптовая продажа форели из Карелии по лучшим ценам с доставкой по РФ!

    [39楼]网友 Windows 7 | Chrome 68.0.3440.106   
  37. JeffreyGew说道:

    Допустим, вы владелец нового вебсайта, который имеет приятный современный дизайн, удобную навигацию и нужную для покупателей информацию. Но покупателей нет. Что делать? Если у вас есть собственный бизнес мы поможем вам создать облачный сервис. Само собой разумеется, ни одно действительное или виртуальное предприятие не может продвигаться само по себе. Всякой фирме необходимо помощь в приобретении популярности, а во Всемирной сети без нее решительно не обойтись из-за яростной конкурентной борьбы.Мы занимаемся разработкой веб портала . Наши сотрудники готовы запустить хороший любой проект в течение десяти суток. Выключая оформления полных онлайн-проектов, мы выполняем перечень работ тех. поддержки: уместное продление хостинга и домена, добавление контента на онлайн-сервис, публикация новостей. Наши услуги посодействуют вам стать лидером на необъятных просторах сети интернета.

    продвижение англоязычного сайта в google

    [40楼]网友 Windows NT | Chrome 68.0.3440.84   
  38. mobiljah说道:

    В жизни, замена экрана на хоноре 10i в мастерской – лучший путь для всех тех, кто вовсе не имеет возможности купить новую аппаратуру и предполагает возобновить дееспособность имеющейся.

    [42楼]网友 Windows 7 | Chrome 66.0.3359.181   
  39. Karliskix说道:

    Hello!
    I I apologize but may this question is already somewhere here and discussed, in the search I did not find anything unfortunately.
    Searched for information in Internet , on forums and boards, blogs , thematic and news sites, etc.
    Many googles and readers about nets . I’m not at all understood where indignant visitors to my sites?

    P.S.
    Thanks anyway
    You can reply to the mail: [email protected].com

    [43楼]网友 Windows NT | Chrome 68.0.3440.106   
  40. WilbertNopewlyCakGlysleple说道:

    2020年最新】Pornhub(ポルノハブ)から無修正エロ動画をダウンロード・保存する方法.
    Pornhub ダウンロード
    best video editor
    youtube to mp3
    youtube to mp4

    [44楼]网友 Windows 7 | Chrome 68.0.3440.106   
  41. MisterDub说道:

    Уважаемые игроки Майнкрафт.
    Предлагаем вашему вниманию комплекс серверов Gamai.Ru,
    которому уже 7 лет.
    Хороший выбор серверов с модами или же классический майнкрафт,
    А так же голодные игры и разного рода миниигры.

    Активируй бесплатный промокод “/kit Gamai2020”

    [45楼]网友 Windows 7 | Chrome 67.0.3396.99   
  42. Keithbum说道:

    SHOP: WOMAN PLUS SIZE, Skirts, Shorts, Leggings, Jeans, Pants, Sets, Bodysuit & Jumpsuits, Sleepwear, T-shirts & tops, Dress, Blouse, BAGS, JEWELRY, SUNGLASSES HATS. +447882185065

    [46楼]网友 Windows NT | Chrome 67.0.3396.87   
  43. martaHiems说道:

    Тут можно прочитать про специи, а ещё интересно написано про Что такое цвет?

    https://yourdesires.ru/finance/business-news/371-roketbank-i-bank-otkrytie-ogranichat-rabotu-neskolkih-servisov-20-i-21-avgusta.html

    [47楼]网友 Windows NT | Chrome 67.0.3396.79   
  44. Jonellehox说道:

    Wanna casual sex? My pussy is at your disposal! Find my profile with phone number here – https://cutt.us/milf2020 My nickname is Lisa

    [48楼]网友 Windows 7 | Chrome 66.0.3359.170   
  45. NicolasAdoms说道:

    Tonight it’s it can’t get much worse
    cialisgetdki
    Versus no united should ever feel like
    I’m two quarters and a sympathy down
    cialisgetdki.com
    And I don’t want to disregard how your spokeswoman sounds
    These words are all I experience so I write them
    I desideratum them only just to get not later than
    Dance, tea dance
    We’re falling to to halftime
    Dance, bop
    And these are the lives you fondness to surpass
    Bop, this is the respect they’d leaning
    If they knew how anxiety loved me

    [50楼]网友 Windows NT | Chrome 67.0.3396.62   
  46. Patrickpnm说道:

    Free online word to pdf and pdf to word converter.

    This online PDF converter software can transform PDF documents to editable documents in Microsoft Word Doc format, which can provide higher quality than many other converters. When you use from PDF to Word you will conquer all the difficulties, and, it’s Free.

    Hello, I like your website, just to share a few free tool websites which might help.

    Youtube converter

    Mp3 Youtube

    Youtube to mp3

    Youtube to mp3 downloader

    Y2mate

    Youtube to mp3

    AI video enhancer

    [51楼]网友 Windows NT | Chrome 67.0.3396.79   
  47. YenovoM601说道:

    Hello, just came across your website, really like your works!
    Would like to share some useful website, hope you like it.
    Youtube Converter
    y2mate
    Youtube to mp3
    Youtube to mp3 downloader
    YouTube MP3 変換
    Youtube to mp4

    [52楼]网友 Windows NT | Chrome 68.0.3440.106   
  48. drug rehab centers说道:

    Way cool! Some very valid points! I appreciate you penning this write-up plus the rest of the website is really good.

    [53楼]网友 Windows 7 | Chrome 63.0.3239.26   
  49. Georgehap说道:

    Привет всем)  Какие новости ребята?

    [54楼]网友 Windows 7 | Chrome 66.0.3359.170   
  50. AlinaaRein说道:

    http://profsoftorg.ru/index.php?productID=101429
    http://stodrelei.ru/index.php?productID=6017
    http://refta.ru/index.php?productID=133196
    http://dreamstroi.ru/95-plyusy-plastikovyh-trub-dlya-kanalizacii.html

    [55楼]网友 Windows NT | Chrome 67.0.3396.79   
  51. likgsevig说道:

    Güzel, uzun zamandır arıyoruz
    _________________
    Iddaa oran formГјlleri, iddaa programД± nasД±l hazД±rlanД±yor

    [56楼]网友 Windows 7 | Chrome 68.0.3440.106   
  52. Ranoldvit说道:

    Нравится играть в майнкрафт и ищешь хороший СЕРВЕР?
    Приглашаю тебя на свой сервер Гамай.Ру.

    Чем же он отличается от остальных?
    А тем что на нём ты не найдёшь миллионы алмазов, кучу игроков в зачарованных сетах на 1000 лвл, дюпы и тд.
    Здесь ты можешь создать собственный клан.

    Нет дюпов, честная, грамотная и отзывчивая Администрация. Блин, чего я рассказываю, заходи и сам всё узнаешь!!!

    Активируй бесплатный промокод “/kit Gamai2020”

    [57楼]网友 Windows NT | Chrome 67.0.3396.87   
  53. skyreveryZet说道:

    https://skyrevery.ru/populyarnye_napravleniya/barcelona/ – Заказать частный самолет в Барселону или арендовать бизнес-джет – SkyRevery – подробнее на нашем сайте https://skyrevery.ru – skyrevery.ru
    https://skyrevery.ru/ – Аренда частного самолета с экипажем в компании SkyRevery – это выбор тех, кто ценит свое время и живет по своему расписанию!
    Аренда частного самолета помогает экономить самый важный ресурс – время. Арендовав частный самолет, именно Вы решаете, когда и куда полетите. Для выполнения чартерных рейсов мы предлагаем частные самолеты иностранного производства, гарантирующие высокий уровень комфорта и безопасности полета. Внимательные бортпроводники и высокопрофессиональные пилоты сделают Ваш полет максимально приятным и удобным.
    Когда Вам нужна https://skyrevery.ru/ – аренда самолета срочно, мы можем организовать для Вас вылет по готовности от 3 часов с момента подтверждения.

    [58楼]网友 Windows 7 | Chrome 67.0.3396.99   
  54. AllenLeT说道:

    Hello!
    I’m looking for a demo of the game named X-Hex. The essence of the game is this.
    Field lozenge. On the fields put dots. Because of these points the field grows and becomes grand.
    At the moment when it begins to touch the opponent’s field. Dots begin run across now to the enemy, then rearward. The winner is the one who conquers the entire field.
    There bonuses, a call to an aircraft that randomly bombes the enemy’s fields and can hurt yours. Very interesting toy.

    P.S.
    Thanks in advance
    You can reply to the mail: [email protected].com

    [59楼]网友 Windows XP | Chrome 49.0.2623.112   
  55. DarMew说道:

    Hello everyone!
    Tell dear friends, where can I settle down?
    CPU during the day overloaded by 100%, on the online site maximum 600 visits, apparently the 403 error pops up.
    What is the amount of uniques in a day it’s hard to say for sure, everywhere the statistics diverge, but on average I think 20-30k.
    Subject of the site: entertaining, there are no streams, but there are a lot of pages. Visitors from all countries, the site is multilingual. Site weight plus minus 2 gigabytes. Dedicated server expensive for me, because I don’t make money on advertising.
    P.S.
    Thanks anyway
    You can reply to the mail: [email protected].com

    [60楼]网友 Windows 7 | Chrome 68.0.3440.106   
  56. alcohol rehab centers说道:

    When someone writes an post he/she keeps the image of
    a user in his/her mind that how a user can be aware of it.

    Thus that’s why this post is amazing. Thanks!

    [61楼]网友 Windows 7 | Chrome 55.0.2883.87   
  57. MilaCale说道:

    Hello!
    Looking for CMS for service page, there will be tidings, minimum info and catalog technical documentation, with access for downloading by pass.
    Can someone tell me which way to look? Unfortunately, he didn’t find anything.
    P.S.
    Thank you very much
    You can reply to the mail: [email protected].com

    [62楼]网友 Windows 7 | Chrome 68.0.3440.106   

表情

大眼 可爱 大笑 坏笑 害羞 发怒 折磨 快哭了 大哭 白眼 晕 流汗 困 腼腆 惊讶 憨笑 色 得意 骷髅 囧 睡觉 眨眼 亲亲 疑问 闭嘴 难过 淡定 抗议 鄙视 猪头