Структурата на папки и елементи, HTML урок

В тази част на урока ще ви запознаем с новите термини, използвани в описанието на папката и HTML-елементи.

Забележка: Папката е също често се нарича директория или директория.

място

Да не се държи всички файлове в една папка. Дори малки уеб сайтове много по-лесни за управление, ако разширяваме HTML документи. изображения и други ресурси в различни папки, като по този начин създават определена структура на местоположението на различни файлове. Чрез структуриране на файловете, както желаете, можете да изберете достатъчно гъвкава система за организиране на файлове, имайки предвид, че сайтът може да расте на файловата система в този случай ще бъде ясна и разбираема. Структура (йерархия) на директории, в които са разположени на различни файлове, обикновено можете да се разглежда като едно дърво. Помислете за пример на следващото изображение.

Както можете да видите, структурата - това е просто схема на разполагане на една директория в друга. В примера, който използва всичките три директории, но това ще бъде достатъчно, за да се опише цялата необходима информация. Често директории описан чрез думи за наследствени (семейни) връзки. В момента има една папка, наречена "банани", тя се намира в папката "Плодове". Папка "Плодове" - родител директория "банани" и директорията "банани" - едно дете (дете директория) папка "Плодове". Ние също имаме друга папка "Киви", който също е дете директория "Плодове".

За да ви помогне по-добре да се помни, описва условията отделно:

Дете директория - папката, на която йерархична дърво има главна директория.
Родител директория - това е папката, която съдържа друга папка.
Има такова нещо като "корен" - е основният (основна) в папката, където са всички останали директории и файлове.

елементите

елементи структура могат също да присъстват под формата на диаграма, показваща разполагане на един елемент на друг. Помислете за един прост пример:

Диаграма, показваща вложени елементи могат да бъдат представени, както следва:

Дете елемент - елемент, върху който йерархична дърво има главен елемент. Дете елемент също се нарича детето.
Братя и сестри - е още едно дете от една и съща майка елемент в същите отрасли ниво. Тези елементи се наричат също сестра. в примера на такива елементи са и . и <style> .</li> <li>Коренът елемент - горния елемент в йерархията (<html> ), Всички останали елементи са негови потомци.</li> <li>Майка елемент - елемент, който съдържа други елементи. Понякога това се нарича просто като родител.</li> <li>То може да бъде наследник на едно дете елемент директно, но обикновено това е общо име за всички елементи, които са вградени в други елементи, независимо от това колко дълбоко те са вградени, например <head>, <title>, <body>, <p> и <style> Те са потомци елемент <html>.</li> </ul> <p>На тази тема виж:</p> <hr> </div> <div class="extra"> <div class="clear"></div> </div> </article> </div> </div> </div> </div> <div id="sidebar" class="col-1-3"> <div class="wrap-col"> <div class="box"> <div class="content"> <ul> <li><a href="/articles/pozdrav-v-biznes-komunikacija.html">Поздрав в бизнес комуникация</a></li> <li><a href="/articles/cvetja-ot-shifon-s-rcete-si.html">Цветя от шифон с ръцете си</a></li> <li><a href="/articles/pohvala-kozmetika-relouis.html">Похвала - козметика relouis</a></li> <li><a href="/articles/v-izplaknete-ustata-si-sled-kato-hlorheksidin-za.html">В изплакнете устата си, след като хлорхексидин за отстраняване на мъдреци и сода</a></li> <li><a href="/articles/ljato-buket-ot-basejna-pluven-basejn-otdih.html">Лято "букет" от басейна - плувен басейн, отдих, опасност, инфекция, болест, профилактика</a></li> </ul> </div> </div> </div> </div> </div> </div> </section> <footer> <div class="wrap-footer kidrfgnb"> <div class="row"> <div class="col-full"> <div class="wrap-col"> <div class="box"> <div class="content"> <ul> <li><a href="/articles/posoka-na-prevod-na-anglijski-ezik-primeri.html">Посока на превод на английски език, примери, транскрипции, произношение</a></li> <li><a href="/articles/mark-pravi-shema-broderija-krst.html">Марк прави схема бродерия кръст</a></li> <li><a href="/articles/saint-joasaf-episkop-na-belgorod-plen-pravoslavna.html">Saint Йоасаф, епископ на Белгород, пълен православна Молитва</a></li> <li><a href="/articles/dizajnt-na-teleskopa.html">Дизайнът на телескопа</a></li> <li><a href="/articles/vzmozhno-li-e-da-se-vzstanovi-chovek-na-vodolej.html">Възможно ли е да се възстанови човек на Водолей, форум</a></li> </ul> </div> </div> </div> </div> </div> </div> <div class="copyright"> <p>© Copyright 2026 | Всички права запазени</p> </div> </footer> </div> <style> #cookieNoticeOverlay{position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;padding:20px}#cookieNoticeBox{width:100%;max-width:520px;background:#fff;border-radius:18px;padding:28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.35);font-family:Arial,sans-serif;text-align:center}#cookieNoticeBox h2{margin:0 0 14px;font-size:24px;line-height:1.25;color:#111}#cookieNoticeBox p{margin:0 0 22px;font-size:16px;line-height:1.5;color:#333}#cookieNoticeOk{display:inline-block;width:100%;max-width:240px;border-radius:12px;padding:14px 22px;background:#111;color:#fff;font-size:17px;font-weight:700;text-decoration:none;box-sizing:border-box;cursor:pointer}#cookieNoticeOk:hover{background:#333}body.cookie-notice-locked{overflow:hidden} </style> <div id="cookieNoticeOverlay"> <div id="cookieNoticeBox" role="dialog" aria-modal="true"> <h2>Cookie на сайта</h2> <p>Използваме cookie за правилната работа на сайта и подобряване на услугата.</p> </div> </div> <script> (function(){var storageKey='cookie_notice_ok_until';var showAgainAfter=24*60*60*1000;var now=Date.now();function getAcceptedUntil(){try{return Number(localStorage.getItem(storageKey))||0}catch(e){return 0}} function setAcceptedUntil(value){try{localStorage.setItem(storageKey,String(value))}catch(e){}} if(getAcceptedUntil()>now){return} var overlay=document.getElementById('cookieNoticeOverlay');var okLink=document.getElementById('cookieNoticeOk');if(!overlay||!okLink){return} function showNotice(){overlay.style.display='flex';document.body.classList.add('cookie-notice-locked')} function closeNotice(){overlay.style.display='none';document.body.classList.remove('cookie-notice-locked')} okLink.addEventListener('click',function(event){event.preventDefault();setAcceptedUntil(Date.now()+showAgainAfter);var rawHref=(okLink.getAttribute('href')||'').trim();if(rawHref==='#'||rawHref===''){closeNotice();return} var targetUrl=new URL(rawHref,window.location.origin).href;window.open(targetUrl,'_blank','noopener,noreferrer');closeNotice()});overlay.addEventListener('click',function(event){event.stopPropagation()});document.addEventListener('keydown',function(event){if(overlay.style.display==='flex'&&event.key==='Escape'){event.preventDefault();event.stopPropagation()}},!0);showNotice()})() </script></body> </html>