Прочетете урока рамки

Текущ урок - последната.

Обяснете какво рамки са и това, което правят най-добре чрез пример. Страницата, която четете в момента, се състои от два кадъра: отляво с изброени всички уроци, както и правото на действителните самите уроците. Можете да превъртате съдържанието на дясната рамка, а в ляво остава фиксирана. Това ви дава възможност по всяко време да не си давам зор на всеки урок, а не търси връзката в долната или горната част на страницата. С една дума, интелигентно използване на рамки може значително да опрости навигацията на сайта и подобряване на своя дизайн.

На първо място, да създаде два файла - vasja.html и pupkin.html:

Сега ние правим една трета файл, наречен index.html (може да се нарече по различен начин):

Това е, което ние ще разгледаме по-подробно. На първо място, няма тагове и . Може да се каже тяхната роля се изпълнява от маркера . въпреки че това не е съвсем вярно. свободен край (Превежда като "от рамки") с атрибутите колони = "50%, 50%" казва на браузъра, че страницата трябва да бъде разделена на два прозореца (рамкова), всеки ширина от 50% от ширината на страницата. свободен край определя съдържанието и свойствата на всеки кадър (имайте предвид, че той не разполага с затварящ маркер). В този случай, предвид факта, че съдържанието на първия кадър е vasja.html файл, а вторият - файл pupkin.html (рамки, считано от ляво на дясно и отгоре надолу тук - този пример в действие (отваря се в нов прозорец) Цялата още няколко примера ..:

В лявата рамка, ние имаме в менюто и правото - първият урок:

Право рамка, ние сме задали "съдържание" име (може да бъде всеки друг). Сега създайте menu.html файл. тя ще бъде менюто за лявата рамка:

В допълнение към името на стойността на рамката мишена атрибут може да бъде един от следните запазени думи:

Всички по-горе стойности трябва да започват с долна черта и да спечелят само с главни букви.

Използването на рамки на уебсайта си, не можем да забравим, че някои браузъри не поддържат рамки. - По-стари браузъри, реч и др Специално за тях има noframes маркер. в които можете да направите "nefreymovuyu" версия на сайта, или дори само да се изброят линкове към страниците на сайта си. например:

Придържайте следния ред поставяне: първият контейнер , и след това - (Т.е., както в примера). В противен случай, тя може да Netscap'a грешка.</p> <p>Има и друг вид конструкция - вградена рамка (инлайн рамка). Тя може да бъде поставен директно в текста на страницата и изглежда така:</p> <p>LT; BGT; Вашият браузър не поддържа рамки (имате Netscape?). Има трябва да се постави например вградени freyma.lt / BGT;</p> <p>се използва маркер за вграждане такъв кадър <iframe>. Наличието на затварящ маркер е задължително. Между тях, можете да вмъкнете всеки текст за браузъри, които не поддържат фреймове. атрибути:</p> <p>Например, следния код е използван по-горе:</p> <p>Размери на рамката не могат да бъдат променяни от потребителя. Затова noresize атрибут не се използва.</p> <p>И накрая, съвет. Ако вашият сайт е изграден с помощта рамки, а след това посетителите често ще идват при вас с търсачките и по-често, те ще попаднат в един от вътрешните страници. Естествено, те ще видят на сайта не е във формата, в която са били замислени от вас. За да избегнете това, поставете текста в страницата следния код:</p> <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/kakvo-e-minus.html">Какво е минус</a></li> <li><a href="/articles/koj-kaza-che-si-grozen-nevzuchev-aleksandr.html">Кой каза, че си грозен (nevzuchev Александър)</a></li> <li><a href="/articles/kak-da-se-nosjat-obuvki-s-kristali-na-bljaska-na.html">Как да се носят обувки с кристали на блясъка на Холивуд в ежедневието на съвременните модата</a></li> <li><a href="/articles/izba-na-balkona.html">Изба на балкона</a></li> <li><a href="/articles/klatsid-za-deca-ss-sistemni-antibiotici-za.html">Klatsid за деца със системни антибиотици за възпалено гърло</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/teenage-depresija.html">Teenage депресия</a></li> <li><a href="/articles/kak-da-polozhi-kanalizacijata-do-shahtata.html">Как да положи канализацията до шахтата</a></li> <li><a href="/articles/bajc-za-drvo-kakvi-cvetove-da-izbirate-i-na-vodna.html">Байц за дърво, какви цветове да избирате, и на водна основа</a></li> <li><a href="/articles/krasota-zdrave.html">Красота - здраве</a></li> <li><a href="/articles/potmnjavane-na-plastmasi-i-kauchuk.html">Потъмняване на пластмаси и каучук</a></li> </ul> </div> </div> </div> </div> </div> </div> <div class="copyright"> <p>&copy; 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>