Рамките в HTML са начин за разделяне на прозореца на браузъра на множество секции, всяка от които може да зареди и покаже различен HTML документ. В тази статия ще видим практически примери за рамки в HTML.

Въпреки че използването му намаля през последните години поради приемането на по-модерни и гъвкави техники, като CSS и JavaScript все още може да се намери на някои уебсайтове, особено на тези, създадени през 90-те и началото на 90-те години. този от 2000 г.

Как работят рамките или рамките в HTML?

Рамките са съставени от два елемента:

1. Рамка: Елементът се използва за разделяне на прозореца на браузъра на правоъгълни секции, всяка от които може да зареди свой собствен HTML документ.

instagram story viewer

2. рамки: Елементът се използва в рамките на a за определяне на всеки от отделните раздели. И изпраща да извика някакъв друг документ, който е зареден в набора от рамки.

• Следвайте с: Примери за iFrame

Как да направите рамки в HTML

За да създадете HTML документ с рамки, следвайте две много прости стъпки:

1. Създайте HTML документ, който дефинира структурата на рамките с помощта на елемента. Например:

Файл 1: frameset.html

2. Създайте един или повече HTML документи, които да бъдат заредени в рамките.

Файл 2: frame1.html

Това е кадър 1

Файл 3: frame2.html

Това е рамка 2

Атрибути на рамки в HTML

Някои от най-важните атрибути на елемента са:

• превъртане: Този атрибут се използва за контролиране на външния вид на лентите за превъртане в рамката. Може да има стойности "автоматично", "да" или "не".

• noresize: Този атрибут се използва, за да попречи на потребителя да промени размера на рамката.

• ямс: Този атрибут се използва за даване на име на рамката, което може да бъде полезно за препратка към рамката във връзки и скриптове.

• src: Този атрибут се използва за указване на URL адреса на HTML документа, който да бъде зареден в рамката.

• граница на рамката: Този атрибут определя дали рамките трябва да имат граници или не. Възможните стойности са "1" (за показване на граници) или "0" (за показване без граници). Например, .

• граница: Този атрибут определя ширината на границата между рамките в пиксели. Например, ще създаде граница от 5px между рамките.

• междурамки: Този атрибут е подобен на граница. Той също така определя разстоянието между кадрите в пиксели. Например, ще зададе празнина от 10px между рамките.

• bordercolor: Този атрибут ви позволява да промените цвета на границите на рамките. Всеки валиден цвят може да бъде посочен. Например, ще направи рамката на рамките червена.

Пример за употреба:

Как да се свърже с конкретен кадър

Можем да направим връзка отворена в определен кадър, като използваме атрибута мишена В етикета. Стойността на мишена трябва да е същото като името на рамката (ямс атрибут на ). Например:

в menu.html
Страница 1
Страница 2

В този случай щракването върху връзките „Страница 1“ или „Страница 2“ в рамката на менюто ще зареди съответната страница в рамката „съдържание“.

Как да счупим рамките

Ако искате връзка за отваряне на страница извън набора от рамки (т.е. замяна на целия набор от рамки), можете да използвате специалната стойност _Горна част за атрибута мишена. Например:

в menu.html
излизам от рамките

Когато щракнете върху „Изход от рамки“, браузърът ще зареди „pageOutofFrames.html“ в целия прозорец, заменяйки набора от рамки.

Пример за разделяне на екрана на две колони с рамки

Този пример разделя екрана на две колони с еднакъв размер. Всяка колона зарежда различна HTML страница.

Пример за създаване на странична лента за навигация с рамки

Този пример създава странична лента, която заема 25% от екрана и се използва за навигация. Останалата част от екрана се използва за показване на основното съдържание.

Пример за разделяне на екрана на редове и колони

Този по-сложен пример разделя екрана на четири равни части. Всеки раздел зарежда различна HTML страница.

Пример за горна навигация с HTML рамки

Създайте файл, който дефинира два кадъра подред. Двата файла, които дефинира са: един за навигация (който заема 20% от ширината на прозореца) и един за основното съдържание (което заема останалата част от ширината на прозореца).

След това ще трябва да създадете файловете "navigation.html" и "content.html". Например „navigation.html“ може да изглежда така:

Страница 1

Страница 2

Страница 3


А „content.html“ може да бъде нещо подобно:

Добре дошли в нашия сайт!

Тук ще отиде съдържанието на страницата, избрана в навигацията.

В този случай, когато щракнете върху връзка в "navigation.html", съответната страница се зарежда в рамката "съдържание".