Чем отличаются теги frameset и frame. Основная концепция фреймов. Пример: Управление границей фреймов

Слово «frame» обозначает рамку, кадр. С помощью фреймов пространство окна браузера делится на независимые разделы, в которых можно отобразить различную информацию. Удобно использовать фреймы при необходимости отображения на экране данных из различных источников.

Замечание 1

Фреймы разбивают окно просмотра браузера на некоторое количество прямоугольных подобластей, которые расположены рядом друг с другом. В эти подобласти можно загружать отдельные HTML-документы и осуществлять их просмотр независимо друг от друга. Между фреймами при необходимости можно организовать взаимодействие, основанное на выборе ссылки в одном из фреймов, которое приведет к загрузке нужного документа в другой фрейм или окно браузера.

Сферы применения фреймов

Разработчики HTML-документов имеют в своем распоряжении богатый выбор форм представления информации на страницах. Текстовая и графическая информации могут быть упорядочены и организованы с помощью списков, таблиц, параметров выравнивания, задания горизонтальных линий, разделений на абзацы. Но не всегда этих возможностей бывает достаточно, в таких случаях требуется разбить окно просмотра браузера на отдельные области (фреймы).

Выбор фреймовой структуры представления информации на WWW оправдывается:

  • при организации управления загрузкой документа в одну из подобластей окна просмотра браузера при одновременной работе в другой подобласти;
  • при расположении в определенном месте окна просмотра информации, которая будет всегда находиться на экране независимо от содержания других подобластей экрана;
  • при отображении информации, удобно расположенной в нескольких подобластях окна, каждая из которых может просматриваться независимо от других.

Ниже на рисунке представлена фреймовая структура окна браузера HTML-страницы.

Данная структура наиболее типична в случаях, когда одни фреймы служат оглавлением документов, а другие используются для загрузки их содержимого. Раньше такая задача без применения фреймов решалась таким способом. На одной из страниц располагалось оглавление, которое состояло из ссылок на другие документы или определенные фрагменты. При переходе по такой ссылке оглавление исчезало, а на его место загружался документ, после прочтения которого нужно было снова вернуться к оглавлению. Когда стали использовать фреймы, подобный возврат утратил свою силу, поскольку оглавление стало постоянно располагаться на части экрана.

Фреймы по своей сути схожи с таблицами, так как с помощью обоих осуществляется разбиение окна просмотра браузера на прямоугольные области с расположенной в них информацией. Однако фреймы позволяют не только форматировать страницы документа, но и организовывать взаимодействие между ними. Принципиально фреймы и таблицы различаются тем, что каждому фрейму соответствует отдельный HTML-документ, а содержимое всех ячеек таблицы является частью одного документа. Помимо этого, отображаемая во фрейме страница может прокручиваться при просмотре независимо от других. Каждый фрейм представляет собой своеобразный отдельный мини-браузер. Таблицы же в отличии от фреймов, которые всегда полностью представлены на экране, зачастую не могут полностью помещаться в окне и просматриваются только по частям. Поэтому можно отметить, что в HTML-таблицах общее число ячеек не ограничено и иногда достигает нескольких сотен, то число фреймов в документе составляет обычно нескольких единиц.

Создание фреймов

Для создания фреймов используются теги.

Дескриптором формируются наборы фреймов, разбивающие пространства окон на строки и столбцы. Затем задаются значения высоты и ширины всех строк и столбцов в процентном отношении к текущим габаритам окна браузера, пикселях или в виде звездочки. Символ звездочки указывает на то, что размеры фреймов зависят от габаритов других фреймов страницы.

Дескриптором определяется структура и содержимое конкретного фрейма.

Ниже приведен пример кода страницы.

Пример работы с фреймами

Достоинства и недостатки фреймов

К достоинствам фреймов можно отнести то, что:

  • они могут одновременно отображать в одном окне различную информацию;
  • с их использованием возможно постоянное отображение какой-нибудь информации (логотипы), при этом не требуется включать ее в каждую страницу сайта;
  • они помогают строить гибкую навигацию по сайту.

К недостаткам фреймов можно отнести:

  • их главное достоинство (отображение информации в одном окне), поскольку доступная область Web-страницы в связи с этим становится значительно меньше;
  • правильный выбор размера фрейма при его создании часто затруднителен, поскольку пользователю приходится постоянно пролистывать фрейм, используя полосы прокрутки;
  • у мониторов с низким разрешением экрана объем видимой информации значительно меньше;
  • многие поисковые системы и каталоги отказывают в регистрации страницам, использующим фреймы.

Замечание 2

Также к недостаткам можно отнести то, что некоторые браузеры не могут обрабатывать фреймы. В этом случае перед пользователем появляется просто пустой экран. Для того, чтобы помочь пользователю в такой ситуации предназначен тег, который позволяет текст, помещенный между открывающим и закрывающим тегами, отобразить, когда не возможно отображение фрейма.

Полосы прокрутки фреймов

По умолчанию браузер отобразит полосы прокрутки только, когда информация не будет помещаться в размерах фрейма. Для этого атрибуту SCROLLING присваивается одно из значений yes (no), что позволяет браузеру всегда скрывать полосы прокрутки или же постоянно отображать их. Скрытие полос прокрутки позволяет увеличить размеры видимой области фрейма. В тоже время, если данные не будут помещаться в окне, то они станут недоступными для пользователя.

Изменение границ фреймов

Изменение границ фрейма может быть запрещено, это делается с помощью атрибута NORESIZE. Данный атрибут удобно использовать, когда пользователю нужно запретить изменять исходную компоновку страницы. По умолчанию пользователю предоставляется возможность перемещения границ фрейма по его усмотрению, он может задать новые размеры объекта в целях улучшения просмотра определенного фрагмента данных. В случаях, когда фреймы не имеют видимых границ, это повлечет за собой автоматический запрет на изменение их размеров. С помощью атрибута BORDER тега можно изменить толщину линий обрамления фрейма. По умолчанию фрейм заключается браузером в рамку серого цвета и толщиной 6 пикселей. Атрибут BORDERCOLOR позволяет изменить цвет рамки. Атрибут FRAMEBORDER позволяет скрыть границы фрейма.

По умолчанию браузером отображаются фреймы с полями между текстом и границей фрейма, равными 10 пикселям.

С помощью атрибута MARGINWIDTH задается ширина левого и правого поля.

А атрибутом MARGINHEIGHT определяется высота верхнего и нижнего поля.

При задании величин полей нужно использовать оба атрибута, поскольку браузером могут автоматически сократиться размеры не указанных полей до минимального значения.

Плавающие фреймы

Плавающие фреймы представляют собой часть Web-страницы и не требуют построения отдельной страницы с их описанием. Для создания таких фреймов используется тег. Атрибутом NAME данного тега задается имя плавающего фрейма, которое в дальнейшем можно использовать в определении гиперссылки, открывающую в этом фрейме соответствующую страницу. Атрибуты WIDTH и HEIGHT задают размеры плавающего фрейма, поскольку у пользователя нет возможности изменить их самостоятельно.

Плавающие фреймы в настоящее время поддерживает только Microsoft IE.

Ниже приведен пример кода страницы:

Пример 1

Пример работы с фреймами

width="350" height="300" align="left">

Пример работы с фреймами

Пример работы с фреймами

Начнем с фреймовой структуры. В чем ее суть? У нас есть возможность в документе, который мы загружаем в браузер, организовать специальные области оконного типа. В эти области можно загружать другие отдельные документы (веб-страницы).

Зачем это нужно? Поскольку документы загружены в свои отдельные области, то ведут они себя независимо. Т.е в одном документе можно что-то делать, при этом другие документы неизменны.

Где можо встретить такие фреймовые структуры? Это файлы помощи, справки (с расширением.chm).

Приведу простой пример документа с фреймами:

Пример фреймов Вы просматриваете эту страницу с помощью браузера, не поддерживающего фреймы.

Элемент frameset . Его задача - охватить область просмотра и разделить ее на отдельные области. Т.е. дать указание браузеру, в каком соотношении и как (горизонтально или вертикально) мы делим эти области.

Элемент frame – описывает каждую такую отдельную область. Тег одиночный. Он занимает те размеры, которые указаны во frameset.

Элемент noframes - отображается, если браузер не поддерживает фреймы.

Обратите внимание, что элемента body нет. Вместо него используется элемент frameset. Это и есть одна из причин, по которой фреймы уже не применяются на сайтах.

Атрибуты элемента frameset

  • cols - вертикальное деление страницы на области просмотра.
  • rows - горизонтальное деление страницы на области просмотра.

Элемент frame

Этот элемент описывает отдельную оконную область. В нее можно загрузить любой документ - с помощью атрибута src. Примеры:

Атрибут scrolling - прокрутка (по умолчанию auto). Если документ превышает размеры области просмотра этого фрейма, значит появляется прокрутка. Если документ помещается полностью во врейм, значит прокрутки нет. Прокрутку можно запрещать, но лучше оставить значение auto.

Одиночный атрибут noresize - запрещает изменять размер фрейма в браузере. По умолчанию это разрешено.

Атрибут frameborder – рамка у фрейма. Значение ‘1’ - рисовать, значение ‘0’ - не рисовать. Допустимы только эти два значения. По умолчанию рамка рисуется.

Атрибут marginwidth – указывает расстояние, которое контент в данной фрейме будет отступать по горизонтали от рамок этого фрейма.

Атрибут marginheight – отступ по вертикали от контента до границ фрейма.

Встроенный фрейм iframe

Элемент iframe (‘строчное окно’). Этот элемент парный (есть отрывающий и закрывающий тег). Этот элемент служит для того же - чтобы в документе организовать оконный элемент.

В чем его отличие от старых фреймов? Он самодостаточен, ему не надо никаких дополнительных контейнеров. И он может стоять в любых документах, так где есть элемент body.

Элемент iframe - это строчный элемент с замещаемым контентом. Т.е. формируется область строчного типа с любыми абстрактными размерами, и в эту область загружается содержание какого-то внешнего документа (файл html).

Iframe обладает такими же атрибутами, что и картинки (т.к. они одного типа): name, width, height, src, frameborder, scrolling, hspace, vspace, marginwidth, marginheight.

Инструкция

Язык HTML (HyperText Markup Language - «язык разметки гипертекста») предусматривает два вида фреймов. «Плавающий» более гибок и его проще вставить в уже существующую . В общем случае конструкция, описывающая врезку окна с помощью плавающего фрейма, выглядит так:Здесь в качестве источника данных для этого фрейма указана существующего сайта (атрибут src). Она и будет открыта во фрейме размером 400 на 300 , как это указано в атрибутах width и height.Вы можете указать в атрибуте src и страницу своего сайта. В этом случае достаточно задать относительный адрес (то есть адрес относительно страницы, в которую вставляется фрейм):В этом образце не указаны и высота фрейма, но зато есть атрибут- id. Используя его, вы можете с помощью CSS () задать для этого фрейма необходимые размеры:

Другой тип фреймов - «классический» - требует наличия отдельной страницы, которая будет содержать описание структуры фреймов. Сами фреймы будут находиться в отдельных страницах, может даже на отдельных сайтах. HTML-код такой страницы-контейнера для фреймов может выглядеть так:




Никаких блоков ... и ... , обязательных для обычных страниц, здесь быть не должно.В этом образце открывающий тег контейнера содержит атрибут rows - это , что пространство страницы должно быть поделено по вертикали и первому фрейму будет отдана верхняя часть. Если заменить rows на cols, то разделение будет горизонтальным. Значение этого атрибута "*,*" указывает, что пропорции разделения - по 50% каждому. Если указать, например "20%,*", то первому фрейму будет отдано только 20%, а остальное пространство - второму.Пользователь может сам изменять эти пропорции, перетаскивая границы фреймов мышкой, но есть возможность запретить это действие. Для этого в тег конкретного фрейма нужно добавить атрибут noresize. Можно также указать размеры отступов от соседнего фрейма по вертикали и горизонтали (атрибуты marginwidth и marginheight):Есть возможность задавать правила поведения для полос прокрутки каждого фрейма в отдельности. Для этого используется атрибут scrolling, который может содержать одно из трех предопределенных значений. Если указать scrolling="auto", то прокрутки будут появляться когда содержимое фрейма не вмещается в его границы. Если "yes" - полосы будут присутствовать постоянно, независимо от наличия необходимости в них. Если "no" - это будет означать запрет полос прокрутки для этого фрейма.

Исходя из информации, изложенной на двух предыдущих шагах, вам нужно сконструировать html-код, который более подходит для решения вашей задачи. После этого останется лишь вставить его в исходный код страницы. Для этого можно воспользоваться редактором страниц системы управления вашим сайтом - откройте в нем нужную страницу, переключите в режим редактирования html-кода и вставьте ваш код в нужное место страницы. А можно файл исходного кода страницы файл-менеджером управления хостинга или системы управления сайтом, открыть его в текстовом редакторе и вставить код в нем. А затем тем же способом закачать измененный код обратно на .

Фреймы — это HTML-элементы, позволяющие разделить окно веб-браузера на несколько независимых окон, в каждое из которых можно загрузить отдельный HTML-документ. Каждое такое окно (фрейм) может иметь собственные полосы прокрутки и функционировать независимо от других независимых окон либо наоборот управлять их содержанием. Они могут применяться для организации постоянно находящегося в одном окне меню, в то время как в другом окне располагается непосредственно сама информация. Пользователи могут обращаться к меню в любой момент, и им не нужно возвращаться к предыдущей странице, чтобы выбрать другой пункт меню. Применение фреймов позволит вам «закрепить» в окне браузера изображения или другие неподвижные по замыслу элементы интерфейса, в то время как остальная часть страницы будет прокручиваться во фрейме.
Однако, стоит отметить, что в наши дни фреймы считаются устаревшим средством, а сайты с фреймами теперь считаются несолидными, так как профессиональные веб-мастера никогда не используют фреймы в своих проектах. С фреймами связан целый ряд печально известных проблем. Они, например, сбивают с толку поисковые машины, поскольку на страницах, которые содержат контент, нет ссылок на другие документы. Если вы хотите получать посетителей с поисковых систем, забудьте о фреймах. Понравившуюся страницу пользователю невозможно поместить в раздел закладки браузера, так как фреймы скрывают адрес страницы, на которой он находится, и всегда показывают только адрес веб-сайта. По этой причине они создают проблемы для браузеров при отслеживании хронологии и еще они не слишком приспособлены для разных размеров экранов и мобильных устройств.
Несмотря на то, что проекты с фреймами встречаются во всемирной паутине все реже, изучение HTML было бы неполным без рассмотрения темы о фреймах. У фреймов наряду с недостатками есть и некоторые достоинства, которые не позволяют отбросить эту технологию как бесперспективную.

Создание фреймов

Структура HTML-документа с фреймами внешне очень напоминает формат обычного HTML-документа. Как и в обычном HTML-документе, весь код помещен между парными тегами и , а в контейнере располагаются заголовки. Основное отличие документа с фреймами от обычного HTML-документа — у документа с фреймами вместо тега применяется парный тег (от англ. frame set – набор фреймов).
В следующем примере приведена структура HTML-документа с фреймами:

Пример: Структура HTML-документа с фреймами

  • Попробуй сам »
frame_top
frame_left frame_right



Документ с фреймами

В приведенном примере страница содержит три области, в каждую из которых первоначально загружаются HTML-документы frame_top.html, frame_left.html и frame_right.html. Помимо HTML-документов, фрейм может содержать и графику. Для этого необходимо указать адрес соответствующего изображения в атрибуте src , например src="image.gif" . Обратите внимание, что элемент используется без закрывающего тега.
Внутри контейнера могут содержаться только теги или другой набор фреймов, охваченный тегами и .
Тег имеет следующие атрибуты:

  • rows — описывает разбиение страницы на строки:
  • cols — описывает разбиение страницы на столбцы:
Области, полученные в результате такого разбиения страницы, и будут являться фреймами. Отсутствие этих атрибутов определяет один фрейм, который займет все окно браузера.

В значении атрибутов rows и cols необходимо указывать не количество строк или столбцов, а значение ширины и высоты фреймов. Все значения в списке разделяются запятыми. Размеры могут быть указаны в абсолютных единицах (в пикселах) или в процентах:

  • cols="20%, 80%" — окно браузера разбивается на две колонки с помощью атрибута cols , левая колонка занимает 20%, а правая 80% окна браузера.
  • rows="100, *" окно браузера разбивается на два горизонтальных окна с помощью атрибута rows , верхнее окно занимает 100 пикселов, а нижнее — оставшееся пространство, заданное символом звездочки.

Как видно из данного примера, контейнер с атрибутом rows вначале создает два горизонтальных фрейма, а вместо второго фрейма подставляется еще один , который разбивает нижний горизонтальный фрейм на две колонки с помощью атрибута cols , левая колонка занимает занимает 20%, а правая 80% окна браузера.
Если браузер не поддерживает фреймы, то в окне будет отображен текст, расположенный между тегами </b> и <b> . Все, что находится между тегами </b> и <b> , игнорируется браузерами, поддерживающими фреймы. Таким образом разработчику нужно написать код, дублирующий содержимое фреймов другими средствами, и поместить этот код в контейнер </b> , тогда все пользователи смогут увидеть его веб-страницу.<br> Как уже отмечалось, для вставки в документ отдельного фрейма служит непарный тег <b><frame> </b> . Атрибут <b>src </b> задает документ, который должен отображаться внутри данного фрейма, например: <frame src="frame_top.html">. Если атрибут <b>src </b> отсутствует, отображается пустой фрейм.</p> <h2>Границы или пространство между фреймами</h2> <p>По умолчанию, браузер отображает серую и, как правило, в виде трехмерной линии границу между фреймами, с помощью которой посетители могут регулировать размер фрейма.<br> Границей фрейма можно управлять, как и любыми другими элементами фрейма. Для этого существует несколько атрибутов элемента <b><frameset> </b> , позволяющих настраивать границы фреймов. Толщина линии границы определяется атрибутом <b>border </b>. По умолчанию значение толщины границы равно пяти.<br> Чтобы скрыть границу фрейма, необходимо либо указать значение ширины границы равным нулю, либо присвоить значение «no» или «0» атрибуту <b>frameborder </b>. Атрибут <b>frameborder </b> может принимать только два противоположных значения. Если значение атрибута <b>frameborder </b> равно «yes» или «1», то граница фреймов будет отображаться, а если «0» или «no», то нет. Учтите, что значения атрибута <b>frameborder </b> различаются для <a href="/phone/kak-pomenyat-razmer-stranicy-v-brauzere-kak-uvelichit-masshtab.html">разных браузеров</a>. Чтобы решить эту проблему используйте дважды атрибут <b>frameborder </b>, а для некоторых браузеров требуется еще добавить атрибут <b>framespacing </b> со значением «0»:</p><p> <frameset frameborder="0" framespacing="0" frameborder="no" border="0"> </p><p>В следующем примере убираем границу между фреймами:</p> <h3>Пример: Убираем границу между фреймами</h3> <ul><li>Попробуй сам »</li> </ul><table><tr><td style="width: 10px;background-color:green;color: white;"> frame_left </td> <td style="width: 90%;background-color:lime;color: white;"> frame_right </td> </tr></table><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Фреймы без границ</title> </head> <frameset cols="100,*" frameborder="0" framespacing="0" frameborder="no" border="0"> <frame src="frame_left.html" name=" frame_left" > <frame src="frame_right.html" name="frame_right" > </frameset> </html></p> <p>Если вы удалите границу между фреймами, посетители не смогут изменять размер фрейма в браузере. Вы можете также не допустить изменения размера фрейма, сохранив границы, используя атрибут <b>noresize </b>:</p><p> <frame src="frame_left.html" noresize> </p><p>С помощью атрибута <b>bordercolor </b> можно изменить цвет границы фрейма, необходимо только указать код или соответствующее зарезервированное имя цвета.<br> Ниже приведен пример html-страницы, которая содержит описанные выше атрибуты управления границей фрейма: цвет границы — красный, изменять размер верхнего фрейма нельзя:</p> <h3>Пример: Управление границей фреймов</h3> <ul><li>Попробуй сам »</li> </ul><table style="border-collapse:collapse;"><tr><td style="border-bottom: 4px solid red;background-color:blue;color: white;" colspan="2">frame_top</td> </tr><tr><td style="border-right: 4px solid red;width: 20%;background-color:green;color: white;">frame_left</td> <td style="width: 80%;background-color:lime;color: white;">frame_right</td> </tr></table><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Управление границей фреймов</title> </head> <frameset rows="150, *" border="10" bordercolor="red" frameborder="1" frameborder="yes"> <frame src="frame_top.html" noresize> <frameset cols="20%, 80%"> <frame src="frame_left.html"> <frame src="frame_right.html"> </frameset> </frameset> </html></p> <p>Если вы хотите расположить страницу, отображаемую внутри фрейма, ближе к его границам, или, наоборот, отодвинуть дальше, измените атрибуты <b>marginheight </b> и <b>marginwidth </b> тэга <b><frame> </b> . Атрибут <b>marginheight </b> определяет отступ между содержимым фрейма и его верхней и нижней границами. Синтаксис:</p><p> <frame marginheight="число"> </p><p>Атрибут <b>marginwidth </b> определяет отступ между содержимым фрейма и его правой и левой границами. Синтаксис:</p><p> <frame marginwidth="число"> </p><p>Данная <a href="/rates/novyi-abzac-v-html-kak-sdelat-krasnuyu-stroku-v-html-ili-otstup.html">строка html</a>, например, располагает отображаемую страницу вплотную к границе фрейма:</p> <p>Если страница отображает нежелательную для вас полосу прокрутки, вы можете решить эту проблему, указав атрибут <b>scrolling </b>="no" в тэге <b><frame> </b> . Но учтите, что если фрейм будет недостаточно большим, чтобы отобразить все содержимое страницы, то у посетителя не будет никакой возможности прокрутить отображаемую страницу.</p> <h2>Ссылки внутри фреймов</h2> <p>Переход по ссылке в обычном HTML-документе осуществляется следующим образом: нажимаете ссылку и текущий документ заменяется новым в текущем либо в новом окне браузера. При использовании фреймов схема загрузки html-документов отличается от обычной и главное отличие — это возможность загружать html-документ в один фрейм из другого фрейма.<br> Для загрузки документа в определенный фрейм используется атрибут <b>target </b> тега <b><a> </b> . В качестве значения атрибута <b>target </b> используется имя фрейма, в который будет загружаться документ, указанный атрибутом <b>name </b> тега <b><frame> </b> . Стоит также отметить, что имя фрейма должно начинаться либо с цифры либо с латинской буквы. Следующие имена используются в качестве зарезервированных:</p> <p>Для внешних ссылок следует задавать в качестве значения для атрибута target либо _top , либо _blank , для того, чтобы сторонние проекты отображались не в ваших фреймах, а занимали полное окно браузера.</p> <p>В следующем примере изображен HTML-документ, в правый фрейм которого загружается страница по ссылке, помещенной в верхний фрейм. Ссылка на документ, который откроется в правом фрейме:</p><p> <a href="http://www.google.com" target="frame_right">Google</a> </p><p>Правому фрейму присваивается имя <i>frame_right </i>:</p><p> <frame src="frame_right.html" name="frame_right"> </p><p>Чтобы документ загружался в указанный фрейм, используется конструкция <i>target="frame_right" </i>, как показано в примере:</p> <h3>Пример: Ссылка на другой фрейм</h3> <ul><li>Попробуй сам »</li> </ul><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Ссылка на другой фрейм</title> </head> <frameset rows="100, *"> <frame src="frame_topic.html"> <frameset cols="20%, 80%"> <frame src="frame_left.html"> <frame src="frame_right.html" name="frame_right"> </frameset> <noframes> <p>Ваш браузер не отображает фреймы</p>

Плавающие фреймы

Элемент

Окно браузера может быть разделено на части, которые называются фреймами, иногда кадрами; можно их назвать и подокнами. В каждую такую часть окна браузера, т.е. фрейм, может быть загружен отдельный HTML документ. Рассмотрим пример окна браузера с тремя фреймами.

В каждый фрейм в этом случае для наглядности загружен простой HTML документ, сообщающий номер фрейма и название файла, хранящего его содержимое. Если в фрейм будет загружен реальный документ, который не помещается полностью в нем, то у фрейма (внимание, не у всего окна!) появятся вертикальная и/или горизонтальная полосы прокрутки в зависимости от того, по горизонтали и/или по вертикали не помещается содержимое документа.
Например, дизайн и структура вашего сайта таковы, что есть одинаковые элементы, повторяющиеся на каждой странице сайта: название, навигационное меню, адрес в конце страницы или какие-то иные подобные элементы. Изменяется только содержание разделов. Тогда страницы можно разбить на части таким образом, чтобы неизменяемые части были помещены в отдельные фреймы, а еще один фрейм выделить для того, чтобы в него загружалось содержимое нужного раздела после щелчка на соответствующей ссылке, например, из меню.
Это дает экономию в скорости загрузки, так как одинаковые части страниц сайта повторно не загружаются, а просто все время отображаются в отведенных им фреймах.

Создание структуры фреймов элемент FRAMESET

Структура разбивки окна хранится в отдельном HTML документе, он и называется документом с фреймами. Структура фреймов формируется при помощи специального элемента FRAMESET. Обычный документ имеет один раздел HEAD и один раздел BODY, тогда как в документе с фреймами раздел BODY заменяется описанием структуры фреймов, Т.е. разделом FRAMESET.
В раздел FRAMESET может быть добавлен элемент NOFRAME с альтернативным содержанием для отображения в браузерах, не поддерживающих фреймы, или в браузерах с отключенной поддержкой фреймов. Такие браузеры просто не поймут структуры FRAMESET и NOFRAME, а отобразят помещенный внутри них текст.

Простой документ с фреймами</ТIТLЕ> </span> </HEAD> <FRAМESET > <span> ...описание структуры фреймов... </span> <NOFRAМES> <span> Альтернативное содержание для браузеров, не поддерживающих фреймы </span> </NOFRAМES> </FRAМESET> </HТМL> <p>Обратите внимание, что раздел BODY в документе отсутствует полностью, а элемент NOFRAMES содержится внутри раздела FRAMESET.<br> Сама структура фреймов формируется делением окна браузера на части — строки и колонки; В какой-то степени это похоже не создание таблиц. Для этого у элемента FRAMESET существуют атрибуты cols и rows, задающие деление на колонки и строки соответственно.<br> Единицы измерения, в которых можно задавать размеры фреймов, это, как обычно, пиксели и проценты. Есть еще возможность задавать размер в новой пока для нас единице измерения, которую условно можно назвать «часть» окна. Значения атрибутов cols и rows задаются перечислением размеров соответствующих областей через запятую. Можно комбинировать <a href="/rates/programma-dlya-kopirovaniya-android-kontaktov-na-pk-kak-perekinut-kontakty-s.html">разные способы</a> задания. Рассмотрим несколько примеров, исходя из предположения, что размер окна браузера 800х600 пикселей.</p> <FRAМESET rows= "50%, 50%"> </FRAМESET> <p>Такой код поделит окно по горизонтали на два одинаковых по высоте фрейма (строки). Если задать <a href="/internet/iframe-i-frame-chto-eto-takoe-i-kak-luchshe-ispolzovat-freimy-v-html.html">атрибут cols</a>=» 50%, 50%», то получим две одинаковые по ширине колонки.</p> <span><FRAМESET cols= "120, 400. *"> </span> <span> . . . продолжение определения структуры фреймов. . . </span> </FRAМESET> <p>При таком коде получим три колонки фреймов: левая шириной 120 пикселей, средняя шириной 400 пикселей, а на третью колонку отводится все, что останется от первых двух колонок, в атрибуте это значение обозначается символом звездочки «*».</p> <FRAМESET cols= "1*, 4*"> <span> . . . продолжение определения структуры фреймов. . . </span> </FRAМESET> <p>Такой код создаст две колонки фреймов. Ширина первой принимается за единицу (это обозначается как 1 * или просто *), ширина второй в четыре раза больше. Таким образом, ширина первой будет 20%, а ширина второй 80% от общей ширины окна браузера.</p> <span><FRAМESET cols= "100, 40%, *"> </span> <span> . . . продолжение определения структуры фреймов... </span> </FRAМESET> <p>В приведенном мере комбинируются все три способа задания размеров. Ширина первой колонки будет равна 100 пикселей, для второй отводится 40% оставшейся ширины (800 — 100 = 700), и на третью остается все, что не занято первой и второй колонками.<br> Раздел FRAMESET может содержать вложенные разделы FRAMESET, что позволяет создать довольно сложную структуру фреймов. Допустим, нам надо разделить окно на 4 фрейма следующим образом:</p> <p><img src='https://i1.wp.com/samsebewebmaster.ru/wp-content/uploads/2016/06/Fr-1.jpg' align="center" width="100%" loading=lazy></p> <p>Сначала необходимо организовать 2 колонки таким образом:</p> cols= "100, * " <p>Затем вторую колонку поделить на три строки таким образом:</p> rows=" 80, *, 30" <p>Отдельный фрейм, точнее его описание, задается элементом FRAME и его атрибутами: подробнее о нем чуть позже. Вернемся к вложенным элементам FRAMESET. Рассмотрим пример кода, создающего такую структуру фреймов:</p> <FRAМESET cols= "100, * "> <span> <FRAМE name= "framel" src= "framel.html"> </span> <span> <FRAМESET rows= "80, *, 30"> </span> <span> <FRAМE name= "frame2" src= "frame2.html"> </span> <span> <FRAМE name= "frame3" src= "frame3.html"> </span> <span> <FRAМE name= "frame4" src= "frame4.html"> </span> </FRAМESET> </FRAМESET> <p>Каким образом разбивается окно на фреймы, вроде бы разобрались. При создании фреймов можно сделать так, чтобы границы между фреймами видно не было. Как вы, наверное, уже догадались, делается это при помощи атрибута border его значение должно равняться нулю. Но дело в том, что для фреймов этот атрибут не воспринимается <a href="/internet/skachat-novyi-brauzer-internet-explorer-obnovlyaem-brauzer-internet-explorer-do.html">браузером Internet</a> Explorer, зато поддерживается браузером Netscape Navigator. Для <a href="/services/kak-prosmotret-istoriyu-brauzera-internet-explorer-istoriya-v-internet-explorer.html">Internet Explorer</a> граница между фреймами задается атрибутом frameborder, который не поддерживается браузером Netscape Navigator. Получается, что необходимо задавать <a href="/phone/tablica-umnozheniya-zapis-vydelyaem-cvetom-odinakovye-znacheniya.html">одинаковые значения</a> для обоих атрибутов, чтобы оба браузера восприняли HTML код одинаково и толщина границ между фреймами была одинаковой.<br> Толщину границ или, по-другому, расстояние между фреймами также можно регулировать атрибутом framespacing, значение которого задается в пикселях. Все атрибуты элемента FRAMESET приведены в таблице.</p> <h2>Атрибуты элемента <FRAMESEТ></h2> <table cellspacing="1" cellpadding="15"><tbody><tr><td bgcolor="#E7E7E7" width="20%"> <h3>Атрибут</h3> </td> <td bgcolor="#E7E7E7" width="60%"> <h3>Описание</h3> </td> <td bgcolor="#E7E7E7" width="20%"> <h3>Пример</h3> </td> </tr></tbody></table><table cellspacing="1" cellpadding="15"><tbody><tr><td bgcolor="#E7E7E7" width="20%">rows </td> <td bgcolor="#E7E7E7" width="60%">Определяет количество и размеры горизонтальных фреймов (фреймов строк) в окне браузера. В качестве значения задается список размеров фреймов через запятую. Способы задания размеров: <p>а) в процентах от высоты рабочей области окна браузера например: "30%, 30%, 40%" ;</p> <p>б) в виде знака «*» (звездочка), говорящего о том, что фрейм занимает все <a href="/rates/kak-rasshirit-ob-m-mesta-v-razdele-zhestkogo-diska-c-ili-d-ne-teryaya-dannyh.html">свободное пространство</a> окна браузера, незанятое другими фреймами с явно <a href="/phone/ukazat-razmery-v-fotoshope-izmenenie-razmerov-izobrazheniya-v.html">указанными размерами</a> например, звездочка в записи "25%, 25%, *" равносильна 50%;</p> <p>в) в пикселях например: "75, *" .</p> <p>Все три способа можно совмещать.</p> </td> <td bgcolor="#E7E7E7" width="20%"> rows= "25%, 25%, *" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">cols </td> <td bgcolor="#E7E7E7" width="60%">Определяет количество и размеры вертикальных фреймов (фреймов столбцов) в окне браузера. В качестве значения<br> задается список размеров фреймов через запятую. Размеры задаются так же, как и в предыдущем параметре ROWS. </td> <td bgcolor="#E7E7E7" width="20%"> cols= "265, *" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">border </td> <td bgcolor="#E7E7E7" width="60%">Определяет ширину рамок фреймов в пикселях. <a href="/services/2-daite-harakteristiku-parametram-staticheskoi-tablicy-marshrutizacii-chto-takoe-marshrutizaciya-pereda.html">Данный параметр</a> действует только в браузерах Netscape. </td> <td bgcolor="#E7E7E7" width="20%"> Border= "0" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">frameborder </td> <td bgcolor="#E7E7E7" width="60%">Данный параметр действует только в браузерах lnternet Explorer и определяет наличие рамок у содержащихся внутри элемента FRAMESET фреймов. <a href="/settings/chto-takoe-verstka-obuchenie-na-html-verstalshchika-svoistva-i.html">Возможные значения</a>: Yes отображать рамки; No или 0 не отображать рамки. </td> <td bgcolor="#E7E7E7" width="20%"> Frameborder= "0" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">framespacing </td> <td bgcolor="#E7E7E7" width="60%">Определяет расстояние (так называемую «серую область») между фреймами в пикселях. Данный параметр также необходим для создания фреймов без рамок. </td> <td bgcolor="#E7E7E7" width="20%"> framespacing= "0" </td> </tr></tbody></table><p>Теперь вернемся к элементу FRAME, который описывает отдельный фрейм внутри всей структуры. Обязательный параметр для него — атрибут src, который задает URL HTML — документа или изображения для отображения в этом фрейме. Также лучше задать фрейму имя при помощи <a href="/settings/chto-takoe-product-data-name-kak-ispolzovat-data-atributy-html5.html">атрибута name</a>. Это позволит использовать <a href="/rates/instagram-registraciya-na-kompyutere---eto-prosto-registraciya-v.html">данное имя</a> в качестве значения <a href="/settings/vstavka-giperssylki-v-html-giperssylka-chto-eto-takoe-kak-sdelat.html">атрибута target</a> элемента А и управлять тем, в какой фрейм должна загружаться ссылка. Имена фреймов не могут начинаться с цифр, в качестве начальных символов допустимы только буквы латинскою алфавита (az, AZ).</p> <p>Когда в структуре фреймов не задана рамка между фреймами, их содержимое может слишком плотно примыкать друг к другу, что будет не очень красиво выглядеть. Если хотите раздвинуть содержимое фреймов и при этом все-таки не включать отображение границ между ними, то это можно сделать, задав внутри фреймов отступы. Размер этих отступов задается в пикселях и попарно: для отступов сверху и снизу атрибутом marginheight,<br> а для отступов справа и слева атрибутом marginwidth. Тогда расстояние между содержимым соседних фреймов будет равно сумме соответствующих отступов этих фреймов.</p> <p>Должна ли отображаться рамка вокруг отдельною фрейма, определяется его атрибутом frameborder. Значение yes (или 1) говорит о том, что рамка должна быть, значение no (или 0) указывает, что рамки быть не должно.<br> Пользователь может изменять размер фреймов, созданный <a href="/internet/chto-takoe-html-struktura-dokumenta-html.html">HTML документом</a>. Для этого достаточно подвести курсор мыши к границе фреймов (неважно, видны эти границы или нет) и стандартным для <a href="/settings/operacionnaya-sistema-rosa-novaya-rossiiskaya-operacionnaya-sistema-dlya-pk.html">операционной системы</a> способом изменить размер окна.<br> В <a href="/rates/kak-upravlyat-myshyu-s-pomoshchyu-klaviatury-kak-upravlyat-kursorom-s.html">Windows курсор</a> мыши примет вид двунаправленной черной стрелки. Нажав <a href="/phone/kak-pishetsya-levaya-knopka-myshi-po-angliiskomu-kliki-myshkoi.html">левую кнопку</a> мыши, можно передвинуть границу окна. Аналогично можно изменить и размер фрейма, поскольку фрейм это тоже окно. Если вы рассчитали размеры своих фреймов и не хотите, чтобы пользователь менял их, задайте атрибут noresize. В результате изменение размеров будет запрещено.<br> Как мы уже говорили ранее, полосы прокрутки у фрейма появляются в том случае, если его содержимое в заданных его границах полностью не помещается. Наличие полос прокрутки регулируется атрибутом scrolling. Допустимы три значения yes, no и auto.<br> Значение auto соответствует <a href="/phone/poyavlenie-sinego-ekrana-na-windows-7-chto-delat-pri-poyavlenii-sinego-ekrana-ili.html">автоматическому появлению</a> полос прокрутки в тех случаях, когда это действительно необходимо. Если содержимое видно и так, полос прокрутки нет, если часть содержимого не помещается появляется нужная полоса прокрутки.<br> Значение yes включает обе полосы прокрутки независимо от того, нужны они или нет. Иногда это может выглядеть не очень красиво.<br> Значение no запрещает показывать полосы прокрутки совсем. Будьте осторожны с этим значением, поскольку при его указании можете лишить пользователя возможности увидеть все содержимое фрейма, Когда оно не помещается в нем полностью. Все атрибуты элемента FRAME приведены в таблице.</p> <h2>Атрибуты элемента <FRAME></h2> <table cellspacing="1" cellpadding="15"><tbody><tr><td bgcolor="#E7E7E7" width="20%"> <h3>Атрибут</h3> </td> <td bgcolor="#E7E7E7" width="60%"> <h3>Описание</h3> </td> <td bgcolor="#E7E7E7" width="20%"> <h3>Пример</h3> </td> </tr></tbody></table><table cellspacing="1" cellpadding="15"><tbody><tr><td bgcolor="#E7E7E7" width="20%">src </td> <td bgcolor="#E7E7E7" width="60%">Обязательный параметр. Указывает адрес (URL) HTL<br> файла, отображаемого в данном фрейме </td> <td bgcolor="#E7E7E7" width="20%"> src= "frame2 .html" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">name </td> <td bgcolor="#E7E7E7" width="60%">Определяет имя данного фрейма, которое будет в дальнейшем использоваться для ссылки на него из других документов с помощью атрибута target (см. элемент А). В качестве значения нужно указать любое имя без пробелов с использованием латинских символов и цифр<br> (начальными символами могут быть только буквы латинского алфавита: a-z, A-Z). Имя не должно начинаться с цифр и <a href="/phone/simvoly-dlya-vk-specialnye-simvoly-vkontakte.html">специальных символов</a>. Зарезервированные имена фреймов начинаются со знака подчеркивания. </td> <td bgcolor="#E7E7E7" width="20%"> name= "menu1" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">marginwidth </td> <td bgcolor="#E7E7E7" width="60%">Определяет ширину (в пикселях) левого и правого полей фрейма. Если параметр не указан, браузер самостоятельно определит <a href="/settings/optimalnyi-razmer-shrifta-kak-razmer-shrifta-vliyaet-na-ux-i.html">оптимальный размер</a> отступа. </td> <td bgcolor="#E7E7E7" width="20%"> marginwidth= "0" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">marginheight </td> <td bgcolor="#E7E7E7" width="60%">Определяет ширину (в пикселях) верхнего и нижнего полей фрейма. Если параметр не указан, браузер самостоятельно определит оптимальный размер отступа. </td> <td bgcolor="#E7E7E7" width="20%"> marginheight= "0" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">scrolling </td> <td bgcolor="#E7E7E7" width="60%">Определяет наличие полос прокрутки содержимого фрейма. Возможные значения:<br> yes — отображать полосы прокрутки;<br> no — не отображать полосы прокрутки;<br> auto — отображать полосы прокрутки при необходимости (если документ, указанный в параметре SRC, не умещается во фрейме) </td> <td bgcolor="#E7E7E7" width="20%"> scrolling= "auto" </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">noresize </td> <td bgcolor="#E7E7E7" width="60%">Не позволяет изменять размеры фрейма. Данный параметр является флагом и не требует указания значения. </td> <td bgcolor="#E7E7E7" width="20%"> noresize </td> </tr><tr><td bgcolor="#E7E7E7" width="20%">frameborder </td> <td bgcolor="#E7E7E7" width="60%">Определяет наличие рамок у фрейма. Возможные значения:<br> yes или 1 — отображать рамки;<br> no или 0 — не отображать рамки. </td> <td bgcolor="#E7E7E7" width="20%"> frameborder= "0" </td> </tr></tbody></table> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> <div class="single-popular"> <div class="single-popular-tit col-lg-12"> Популярное в рубрике: </div> <div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="single-popular-item-wrp"> <img width="150" height="120" src="/uploads/5be8b76667696c4cd63a8c38979b50af.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Как объединить слои в фотошопе в один или соединить их в группу Как объединить несколько слоев в фотошоп"/ loading=lazy> <div class="single-popular-item-tit"> Как объединить слои в фотошопе в один или соединить их в группу... </div> <a href="/settings/sposoby-obedineniya-sloev-v-fotoshope-kak-obedinit-sloi-v-fotoshope-v.html" rel="bookmark" title="Как объединить слои в фотошопе в один или соединить их в группу Как объединить несколько слоев в фотошоп">читать</a> <div class="clr"> </div> </div> </div> <div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="single-popular-item-wrp"> <img width="150" height="120" src="/uploads/33b72e60e1d3066a9663f391221dc014.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Перенос контактов на новый телефон android"/ loading=lazy> <div class="single-popular-item-tit"> Перенос контактов на новый телефон android </div> <a href="/phone/perenos-kontaktov-na-novyi-telefon-android-android-prilozheniya.html" rel="bookmark" title="Перенос контактов на новый телефон android">читать</a> <div class="clr"> </div> </div> </div> <div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="single-popular-item-wrp"> <img width="150" height="120" src="/uploads/ff504b14456f4702a94368a161811b1d.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Самсунг Галакси перезагружается сам по себе — Решения Galaxy note 4 перезагружается сам по себе"/ loading=lazy> <div class="single-popular-item-tit"> Самсунг Галакси перезагружается сам по себе — Решения Galaxy note... </div> <a href="/internet/esli-xiaomi-postoyanno-perezagruzhaetsya-samsung-galaksi-perezagruzhaetsya-sam-po.html" rel="bookmark" title="Самсунг Галакси перезагружается сам по себе — Решения Galaxy note 4 перезагружается сам по себе">читать</a> <div class="clr"> </div> </div> </div> <div class="single-popular-item col-lg-6 col-md-6 col-sm-6 col-xs-6"> <div class="single-popular-item-wrp"> <img width="150" height="120" src="/uploads/242e09224609f2b7cbd6b5b9f2adc411.jpg" class="attachment-sm-widget size-sm-widget wp-post-image" alt="Основные возможности Kaspersky Rescue Disk"/ loading=lazy> <div class="single-popular-item-tit"> Основные возможности Kaspersky Rescue Disk </div> <a href="/rates/skachat-zagruzochnyi-disk-kasperskogo-osnovnye-vozmozhnosti-kaspersky-rescue.html" rel="bookmark" title="Основные возможности Kaspersky Rescue Disk">читать</a> <div class="clr"> </div> </div> </div> <div class="clr"></div> </div> </div>  <div class="sidebar col-lg-3 col-md-4 col-sm-12"> <div class="sidebar-wrp"> <div class="sidebar-wrp-title">Последние Статьи</div> <div class="sidebar-wrp-des"> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/d93303aadea847492ee52538b585df87.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Макбук не подключается к wifi Макбук не видит...</div> <div class="clr"></div> <a href="/phone/macbook-ne-podklyuchaetsya-k-wifi-avtomaticheski-makbuk-ne-podklyuchaetsya-k-wifi-makbuk-ne-vidit-vai-fai.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/094fe0c598853f299be65e8611b45d60.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Как заработать на WebMoney</div> <div class="clr"></div> <a href="/internet/kak-zarabotat-rubli-na-webmoney-kak-zarabotat-na-webmoney-proverennye.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/280d369c9d1e343119c3d855af4b9c4d.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">"Супра", планшет: отзывы покупателей</div> <div class="clr"></div> <a href="/rates/planshet-podelka-est-takoi-supra-firma-supra-planshet-otzyvy-pokupatelei-plyusy-i-minusy.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/b1724f08fa52145089eaa72f836127ee.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Местонахождения судов в реальном времени</div> <div class="clr"></div> <a href="/settings/voennye-korabli-v-realnom-vremeni-onlain-mestonahozhdeniya-sudov-v.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/534951a61241c179a7c060b9fe1143c8.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Лучшие программы для Android Запись звонков от...</div> <div class="clr"></div> <a href="/rates/prilozheniya-dlya-android-obuchayushchie-programmy-dlya-detei-luchshie.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/e280b0808c5e749938522ba1df2a41ec.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Удаляем не читателей в Твиттере</div> <div class="clr"></div> <a href="/services/kak-udalit-ne-vzaimnyh-chitatelei-v-twitter-udalyaem-ne-chitatelei-v.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/229610355b0a27a465c73ddb25664556.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Подключаем интернет на ноутбуке: все возможные...</div> <div class="clr"></div> <a href="/phone/kak-vklyuchit-internet-na-kompyutere-ispolzuya-mobilnyi-telefon.html">читать</a> </div> <div class="last-post col-lg-12 col-md-12 col-sm-6 col-xs-6"> <div class="last-post-img"> <img width="60" height="48" src="/uploads/5399be52c80b405fedf00779a6136b42.jpg" class="attachment-sm-widget2 size-sm-widget2 wp-post-image" alt="" / loading=lazy> </div> <div class="last-post-tit">Samsung Galaxy S IV – новый флагман...</div> <div class="clr"></div> <a href="/phone/samsung-galaxy-s4-vtoroi-vzglyad-samsung-galaxy-s-iv-novyi-flagman-galakticheskogo-masshtaba-galak.html">читать</a> </div> <div class="clr"></div> </div> </div> <div id="text-4" class="widget widget_text sidebar-wrp"> <div class="textwidget"> </div> </div> <div id="ketena1" style="height:500px;width:260px;" align="center"></div> <div class="clr"></div> </div> </div> </div> </div> <div id="footer"> <div class="container"> <div class="row"> <div class="footer-contacts col-lg-6 col-md-6 col-sm-12 col-xs-12"> <img src="/logo/logo.png" loading=lazy> <div class="footer-contacts-tit">innovakon.ru<br>Мобильные телефоны и связь</div> <div class="footer-soc"> <div class="footer-soc-wrp"> <div class="soc_w"> <a href="#" class="soc-link vk" target="_blank"></a> <a href="#" class="soc-link fb" target="_blank"></a> </div> </div> </div> </div> <div class="footer-links col-lg-4 col-md-6 col-sm-12 col-xs-12"> </div> <div class="footer-links col-lg-4 col-md-4 col-sm-4 col-xs-4" style="display: block;"> <ul> <li><a href="">Редакция проекта</a></li> <li><a href="">Реклама на сайте</a></li> </ul> <ul> <li><a href="/feedback.html">Контакты</a></li> <li><a href="/sitemap.xml">Карта сайта</a></li> </ul> </div> </div> </div> <div class="copyright">© 2024 Мобильные телефоны и связь</div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="https://innovakon.ru/wp-content/themes/trudinsp/js/bootstrap.min.js"></script> <script type="text/javascript" src="https://innovakon.ru/wp-content/themes/trudinsp/js/SmoothScroll.js"></script> <a id="scroll-to-top" href="#" title="Scroll to Top">Top</a> <script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script> <script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.4.1'></script> <script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/jquery-smooth-scroll/js/jss-script.min.js?ver=4.8.3'></script> <script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script> <script type='text/javascript' src='/wp-includes/js/jquery/ui/effect.min.js?ver=1.11.4'></script> <script type='text/javascript' src='/wp-includes/js/jquery/ui/effect-blind.min.js?ver=1.11.4'></script> <script type='text/javascript'> /* <![CDATA[ */ var stbUserOptions = { "mode":"css","cssOptions":{ "roundedCorners":false,"mbottom":20,"imgHide":"http:\/\/innovakon.ru\/wp-content\/plugins\/wp-special-textboxes\/themes\/stb-metro\/minus.png","imgShow":"http:\/\/innovakon.ru\/wp-content\/plugins\/wp-special-textboxes\/themes\/stb-metro\/plus.png","strHide":"\u0421\u043a\u0440\u044b\u0442\u044c","strShow":"\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c"} }; /* ]]> */ </script> <script type='text/javascript' src='https://innovakon.ru/wp-content/plugins/wp-special-textboxes/js/wstb.min.js?ver=5.5.101'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.8.3'></script> <script type="text/javascript" id="slb_context">/* <![CDATA[ */if ( !!window.jQuery ) { (function($){ $(document).ready(function(){ if ( !!window.SLB ) { { $.extend(SLB, { "context":["public","user_guest"]} );} } })} )(jQuery);} /* ]]> */</script> </body> </html>