Фреймы (теги frame, frameset, noframe, iframe) Что такое Фреймы в html
жүктеу/скачать 392.34 Kb.
|
frameset> html> Код файла top.html <html> <head> <title>Файл top.html - шапка сайтаtitle> head> <body bgcolor="#b2f2ff" text="#0000FF"> <h1>Пример №2h1> А здесь могло быть лого и не только :) body> html> Код файла menu.html <html> <head> <title>Файл menu.html - меню сайтаtitle> head> <body bgcolor="#b2bbff" text="#112cf5"> <ul> <li><a target="main" href="content.html">Главная страницаa>li> <li><a target="main" href="about-site.html">О сайтеa>li> <li><a target="main" href="about-autor.html">Об автореa>li> <li>...li> ul> body> html> Код файла content.html <html> <head> <title>Файл content.html - контент сайтаtitle> head> <body bgcolor="#e3e5f8" text="#FF0055"> <h1>Главная страницаh1> Содержимое сайта. Сейчас открыт файл content.html <br/>Это исходное состояние нашего фрейма. Назовем этот файл "Главной страницей" body> html> Код файла about-site.html <html> <head> <title>Файл about-site.html - Страница о сайтеtitle> head> <body bgcolor="#e3e5f8" text="#FF0055"> <h1>О сайтеh1> Страница о сайте. Сейчас открыт файл about-site.html body> html> Код файла about-autor.html <html> <head> <title>Файл about-autor.html - об автореtitle> head> <body bgcolor="#e3e5f8" text="#FF0055"> <h1>Об автореh1> Страница об авторе. Сейчас открыт файл about-autor.html body> html> Код файла footer.html <html> <head> <title>Файл footer.html - о сайтеtitle> head> <body bgcolor="#e3e5f8" text="#000000"> Футер сайта. Сейчас открыт файл footer.html body> html> Пояснение к примеру №2 Первоначально вся страница разбивается на три области по горизонтали в пропорции 3:14:3. За это отвечает атрибут rows="15%,70%,15%". Первый фрейм в нашем примере - шапка (мы её обозвали top.html), на нее отводится 15% места по высоте. Далее идет большой фрейм занимающий 70% по высоте. Мы его разбиваем на две части с помощью cols="25%,75%" в пропорции 1:3. Слева будет фрейм menu.html, справа content.html. Мы специально дали имя второму фрейму name="main" с целью возможности переключения страниц. Обратите внимание, что в файле menu.html к каждой ссылки приписан атрибут target="main", что позволяет при нажатии на эту ссылку загружать элементы в область с именем main. Внизу сайта расположился последний фрейм footer.html. Рис 4. Пример №2 - исходное состояние При переходе на страницу о сайте страница будет выглядеть следующим образом: Рис 5. Пример №2 - второе состояние При переходе на страницу об авторе вы увидите следующие: Рис 6. Пример №2 - третье состояние Тег жүктеу/скачать 392.34 Kb.
|