Мировые информационные ресурсы

Путькина Л.В

Рыбакова Е.А

Саитов А.В

 

Мировые информационные ресурсы

HTML – язык разметки гипертекстовых страниц

 

 

Методические указания к выполнению практических работ

 

 

 

Санкт-Петербург

2016

ВВЕДЕНИЕ

HTML (HyperText Markup Language — «язык гипертекстовой разметки») – стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.

Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в стенах Европейского Центра ядерных исследований в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантических элементов — дескрипторов. Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.

Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE> предназначен для создания в документах таблиц, но часто используется и для оформления размещения элементов на странице. С течением времени основная идея платформонезависимости языка HTML была принесена в жертву современным потребностям в мультимедийном и графическом оформлении.

Практическая работа 1. Создание простой Web - страницы<HR>

 

Цель работы: Изучение элементов HTML, использование тегов при создании Web-страницы

 

Методические указания

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

Существуют следующие типы HTML-тегов: теги-контейнеры и пустые теги.

Контейнер - это пара тегов, состоящий из начального (или открывающего) и конечного (или закрывающего) тегов.

Начальный тег имеет вид:

<TAG>,

где TAG - имя реального HTML-тега.

Конечный тег имеет вид:

</TAG>.

Он отличается от начального тем, что перед именем тега косая черта. Между начальным и конечным тегами заключено содержимое контейнера. Например, элемент, представляющий собой подчеркнутый текст, заключается между тегами <U> и </U>:<U> подчеркнутый текст </U>.

Также существует возможность вложения одного контейнера в: <U><H1> подчеркнутый заголовок первого уровня </H1></U>,

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

<HR> - создает горизонтальную линию и не выполняет при этом никаких действий над текстом.

<P> - приводит к вставке интервала между разделами.

 

Рассмотрим некоторые теги:

< COMMENT > </ COMMENT >

Текст комментария. Текст, помещенный внутри COMMENT, игнорируется браузером. COMMENT может располагаться в любом месте кода Web-страницы. Существует ещё один способ обозначения комментария:

<!--Строка комментария-->.

 

< HTML > </ HTML >

Теги элемента HTML являются самыми " внешними ", т.е. заключают в себе весь остальной текст и другие теги. Допускает вложение элементов HEAD, BODY и PLAINTEXT, определяющих общую структуру Web-страницы.

 

< HEAD ></ HEAD >

Область заголовка Web-страницы. Этот текст представляет собой общую информацию о файле и не отображается в самом документе. В теге <HEAD> может находиться ряд других элементов, включая следующие:

· TITLE (определяет название документа).

· META (сообщает браузеру дополнительную информацию о документе).

· BASE (задает базовый адрес документа).

· SCRIPT (определяет операторы интерпретируемых языков программирования, таких как JavaScript и VBScript)

 

< TITLE > </ TITLE >

Строка текста, расположенная внутри, отображается не в документе, а в заголовке окна браузера. Эта особенность часто используется для организации поиска в WWW.

< META >

Этот элемент содержит служебную информацию, которая не отображается при просмотре Web-страницы. Каждый элемент META содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Например, адрес электронной почты:

name =" Reply - to " content =" Имя @ Адрес "

Имя автора Web-страницы:

name =" Author " content=" Имя автора ".

 

< BODY > </ BODY >

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

Для задания цвета текста: text="#RRGGBB".

Цвет текста гиперссылок: link="#RRGGBB".

Точно также можно задать цвет для использованных гиперссылок: vlink="#RRGGBB" Можно указать изменение цвета для последней выбранной пользователем гиперссылки:   alink="RRGGBB".

Элемент заголовка <H1> </H1>

Существует шесть уровней заголовков, которые обозначаются H1...H6. Заголовок уровня 1 - самый крупный, а уровень 6 обеспечивает самый маленький заголовок.

Порядок выполнения работы

1. Откройте текстовый редактор Блокнот

2. Введите программу для создания Web-страницы

 

 

3. Сохраните файл с именем Работа 1. HTM в свою папку.

4. Для просмотра Web-страницы щелкните левой клавишей мыши по созданному файлу. Вы увидите результат показанный, на рис. 3

 

Рис. 3

 

Контрольные вопросы

1. Что такое теги?

2. Что такое контейнеры, приведите пример.

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

4. Какие операции можно проделать над горизонтальной линией?

5. Как создать вертикальную линию?

6. Приведите синтаксис заголовка 6-го уровня, выровненного по правому краю, красного цвета.

7. Напишите базовый шаблон HTML-документа.

 

Теги физических стилей

· <B> - полужирный шрифт;

· <I> - курсив;

· <TT> - моноширинный шрифт;

· <U> - подчеркивание;

· <SUB> - подстрочный текст;

· <SUP> - надстрочный текст;

· <STRIKE> - зачеркивание.

Теги логических стилей

· <EM> - выделенный текст (обычно курсивом);

· <STRONG> - выделенный текст жирным шрифтом;

· <CITE> - текст в виде цитаты;

· <CODE> - текст-фрагмент HTML-кода;

· <DFN> - текст-определение;

· <SAMP> - текст как пример программы;

· <KBD> - текст, который необходимо ввести с клавиатуры;

· <VAR> - текст, определяющий переменную или значение.

 

Изменение размера шрифта<FONT> </FONT>

С помощью тега FONT можно определить размер и цвет шрифта. Атрибут SIZE позволяет указать абсолютный размер шрифта (он может принимать значения от 1 до 7) или относительный, по отношению к размеру шрифта, используемого в основной части страницы (он может принимать значения от -4 до +4). При этом используется следующий синтаксис:

< FONT SIZE=значение>.

Для изменения размера основного шрифта документа используется элемент BASEFONT. Его синтаксис выглядит следующим образом:

< BASEFONT SIZE=значение>.

Величина основного шрифта может принимать значения от 1 до 7, а стандартный для браузера размер шрифта равен 3.

Если Вы хотите узнать об использовании новых атрибутов, или что такое ЛИСТЫ СТИЛЕЙ или, то обратитесь к "Справочнику HTML".

 

Порядок выполнения работы

1. Введите текст работы в текстовом редакторе Блокнот

 

2. Сохраните файл с именем Работа 2.HTM.

3. На рис. 4. показан результат

Контрольные вопросы

1. Назовите известные вам способы форматирования текста.

2. В чем отличие физического стиля от логического?

3. C помощью какого дескриптора можно вывести на экран стихи (строки смещены относительно друг друга)?

4. Как вывести на экран уравнение 2-го порядка?

5. Выведите на экран простую таблицу, состоящую из заголовка 5-го уровня и 6-ти элементов.

 

Рис. 4

Методические указания

Типы списков

В HTML 4.0 предусмотрены возможности создания различных типов списков. Причем каждый может использоваться как самостоятельно, так и в сочетании с другими типами списков. Существует несколько типов списков (рис. 5):

· упорядоченный (нумерованный) список (рис. 5);

· неупорядоченный (маркированный) список (рис.5);

· список определений (рис. 6).

Рис. 5

 

Нумерованные списки

Нумерованный список  создается с помощью контейнера <OL> </OL>. Каждый элемент списка определяется внутри этого контейнера с помощью тега <LI>. При создании нумерованного списка используется следующий синтаксис:

< OL>

< LI> 1-ый элемент списка

......

< LI> n -ый элемент списка

</OL>.

Каждый тег <LI> служит для определения одного элемента списка. По умолчанию элементы списка нумеруются с помощью обычных арабских цифр. Но можно сделать так, чтобы использовались различные типы букв. Существуют следующие типы нумерации упорядоченных списков:

· 1 - арабские цифры

· a - строчные буквы алфавита

· A - прописные буквы алфавита

· i - строчные римские цифры

· I - прописные римские цифры

Стиль форматирования списка определяется с помощью следующего синтаксиса:

< OL TYPE=тип>.

,

Рис. 6

Маркированные списки

Самым распространенным типом списка является маркированный. При создании маркированных списков используются теги <UL> и </UL>. Как и в нумерованных списках, все элементы маркированных списков определяются с помощью тега <LI>. Когда браузер встречает очередной тег <LI>, он переходит на новую строку.

Чтобы изменить тип маркера для всего списка, нужно воспользоваться таким синтаксисом:

< UL TYPE=тип>.

А для одного элемента:

< LI TYPE=тип>.

Существуют следующие типы маркеров:

· Disk - заполненный кружок

· Square - заполненный квадратик

· Circle - незаполненный кружок

Списки определений

Списки определений чем-то напоминают толковые словари, т.к. каждому термину соответствует абзац определения, расположенный с отступом. Это средство незаменимо в том случае, если нужно создать список элементов с их подробным описанием.

Список определений содержится в контейнере <DL> </DL>. Элементы списка определений создаются с использованием тегов <DT> и <DD>, с помощью которых отмечаются термин и его определение. Например:

< DL>

< DT> термин1

< DD> определение1

< DT> термин2

< DD> определение2

< /DL>.

Внутри элемента <DD> могут находиться нумерованные или маркированные списки. Каждому <DT> может соответствовать несколько <DD>.

Порядок выполнения работы

1. Создайте файл с текстом как указанный на рис. 7

2. Сохраните файл с именем Работа 3. HTM

3. Результат представлен на рис. 8.

Рис. 7

 

 

Рис. 8

 

Контрольные вопросы

1. Какие типы списков вы знаете?
2. Какие типы нумерации упорядоченных списков вы можете назвать?
3. Можно ли использовать буквы русского алфавита в упорядоченных списках?
4. Возможно ли использование нескольких <DD> в одном <DT> списка определений?
5. Обязательны ли конечные теги </UL>, </OL>, </DL>, обоснуйте.

 

Методические указания

Типы гиперссылок

Существует 3 основных типа гиперссылок:

· внутренние,

· внешние,

· относительные.

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

Внешние ссылки - это ссылки на другие Web-cерверы.

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

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

 

Создание внутренних ссылок

Создавая Web-страницу, вы должны предусмотреть для пользователя возможность легко перемещаться от одного раздела к другому. Это достигается путем включения внутренних ссылок и имеет очень важное значение в случае длинной Web-страницы, состоящей из нескольких разделов.

Для внутренней ссылки, как и для внешней, нужно создать текст, на котором будет щелкать пользователь. И точно также нужно включить описание того места, на которое делается ссылка. Для этого место необходимо как-то обозначить. Причем имя, определенное с помощью тега <A NAME="значение">, не будет отображаться в браузере.

Создавая ссылку на другую часть страницы, воспользуйтесь символом (#) и именем привязки. Для этого вы можете выбрать любое имя. В результате получится так называемая объектная привязка:

< A HREF="#торт">Рецепты тортов</A>

Теперь нужно создать соответствующее имя объекта. После щелчка на этой ссылке браузер будет выполнять поиск по Web-странице, пока не найдет ту часть, которой присвоено имя "торт". Эта часть страницы должна быть названа соответствующим образом:

< A NAME="торт">Рецепты тортов-коллекция</A>

Рассмотрим следующий пример:

< A HREF="#торт">Рецепты тортов</A><BR>

< A HREF="#салат">Рецепты салатов</A><BR>

< P>

< A NAME="торт">Рецепты тортов-коллекция</A><BR>

(набор рецептов)<BR><BR>

< A NAME="салат">Рецепты салатов-коллекция</A><BR>

(набор рецептов)<BR><BR>

Порядок выполнения работы

1. Найти Картинки в Интернете и скопируйте в свою папку с работами.

2. Создайте файл, как показано на рис. 9.

 

 

3. Сохраните файл с именем Работа 4.HTM

4. Результат представлен на рис. 10. Для того чтобы появилась картинка необходимо щелкнуть левой клавишей мыши по подчеркнутому тексту

 

Рис. 10

Контрольные вопросы

1. С помощью какого тега создается большинство гиперссылок и где он размещается?

2. Что такое URL, каким он может быть?

3. Как сделать ссылку на чужую Web-страницу?

4. Из каких элементов состоит адрес электронной почты и как делается на него ссылка?

5. Что такое FTP-сервер, его назначение?

 

Методические указания

Выбор типа таблицы

Одной из общих характеристик таблицы является рамка. Для указания ширины рамки используется атрибут BORDER= n, где n - ширина рамки в пикселях. Атрибут BORDER помещается в тег <TABLE>. По умолчанию атрибуту будет присвоено значение 1. Если выбрать значение 0 или вообще опустить атрибут BORDER, то будет создана таблица без рамки.

Для определения ширины таблицы используется атрибут WIDTH, помещенный в тег <TABLE>. По умолчанию ширина таблицы вычисляется как сумма ширин всех столбцов. А ширина каждого столбца (если не выбрать другую установку) по умолчанию определяется так, чтобы в ячейке поместился самый длинный элемент данных или самая большая картинка. Если определить, что таблица занимает, например, 90% пространства экрана Web-браузера, то в ней будет больше свободного места. Для этого нужно добавить атрибут WIDTH в тег <TABLE>:

< TABLE BORDER=2 WIDTH="90%">.

Можно также присвоить атрибуту WIDTH фиксированное значение в пикселях.

С помощью атрибута COLS, помещенного в тег <TABLE>, можно определить количество столбцов таблицы:

< TABLE BORDER=0 COLS="3">.

Для определения интервалов в таблице используются атрибуты СELLSPACING и CELLPADDING, помещенные в тег <TABLE>. Атрибут CELLSPACING определяет расстояние между ячейками в пикселях (стандарт=2). Атрибут CELLPADDING определяет расстояние в пикселях между содержимым ячейки и ее границами (стандарт=1). Например:

< TABLE BORDER CELLSPACING=4 CELLPADDING=5>.

Окрашивание таблиц и рамок

К таблице можно добавить фон, цвет которого отличается от цвета остальной части Web-страницы (рис. 12). Для этого нужно использовать тег <TABLE> с атрибутом BGCOLOR. Значением атрибутов BGCOLOR может быть как шестнадцатеричное число, так и текст. Атрибут BGCOLOR может применяться в тегах <TABLE>, <TR>, <TD>. Например:

<TR BGCOLOR=yellow>.

С помощью тега <TABLE> и атрибутов BORDERCOLOR и BORDERLIGHT можно изменить цвет рамки таблицы. Атрибут BORDER должен быть помещен в тег <TABLE>. Чтобы изменить цвет рамки внутри таблицы, нужно использовать атрибуты BORDERCOLOR и BORDERLIGHT в теге <TR> или <TD>. Значениями этих атрибутов могут быть либо шестнадцатеричное число в виде #rrggbb, либо название цвета, например:

< TABLE BORDER=3 BORDERCOLOR=blue BORDERLIGHT=lightblue>.

Значение атрибута BORDERCOLOR влияет на верхнюю часть рамки трехмерной таблицы, а величина BORDERLIGHT - на нижнюю (на тень).

Порядок выполнения работы

1. Создайте файл, как показано на рис.13

 

 

2. Сохраните файл с именем Работа 5.HTM

3. Результат представлен на рис. 14

 

Рис. 14

Контрольные вопросы

1. Что нужно сделать для того, чтобы сетка таблицы была не видна?

2. Как можно выровнять содержимое ячеек?

3. С помощью каких атрибутов можно выровнять натуральные числа по разделителю дробной части и как это сделать?

4. Что нужно сделать, чтобы включить в ячейки таблицы больше свободного пространства?

5. Можно ли к таблице добавить фон, цвет которого отличается от цвета остальной части Web-страницы?

6. Как разместить подпись слева от таблицы?

 

Методические указания

Карты ссылок состоят из фрагментов изображения, которые являются ссылками на другие URL. После щелчка на активной зоне открывается документ, связанный с этой зоной. Существуют два вида карт ссылок: обрабатываемые клиентом и обрабатываемые сервером. Эти термины говорят о месте расположения информации, связывающей активные зоны изображения и гипертекстовые URL. Для карт ссылок, обрабатываемых клиентом, эта информация хранится в HTML-файле, содержащем код Web-страницы, на которой находится данное изображение. Для карт ссылок, обрабатываемых сервером, указанная информация хранится в файле на Web-сервере.

Порядок выполнения работы

1. Создайте файл, как показано на рис 13.

2. Изображения найти в Интернете и скопировать в свою папку с работами.

3. Сохраните файл с именем Работа 6.

Синий, желтый, розовый, голубой, зеленый треугольники и центральня фигура соответствуют изображения показанные ниже:

Рис. 16

Порядок выполнения работы

1. Откройте текстовый редактор Блокнот

2. Введите программу для создания Web-страницы

4. Сохраните файл с именем Работа 6.HTM

5. Результат представлен на рис. 16

Контрольные вопросы

1. Какие виды карт ссылок вы знаете?

2. Каким должно быть изображение, используемое для карты ссылок?

3. Какие значения может принимать атрибут SHAPE?

4. Назовите основные части HTML-кода карты ссылок.

Методические указания

Использование тега <IMG> для вставки графических изображений

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

Для создания URL изображения используется элемент IMG. Он является для броузера сигналом к тому, что на данное место нужно вставить изображение.< IMG> - это одиночный тег, имеющий следующий синтаксис:

< IMG SRC=URL_изображения>.

SRC обозначает место, где сохраняется изображение. Изображение может находиться на вашем компьютере, на вашем Web-сервере, на любом Web-сервере в Internet. Вместо параметра URL_изображения нужно указать реальный адрес файла изображения.

Вместо URL_изображения может стоять либо полный URL изображения (например: http://www.greatstar.com/lois/picture.gif), либо ссылка на относительный URL графического файла, указывающий на положение файла относительно каталога, в котором находится Web-страница.

Образец HTML-кода процедуры добавления к странице встроенного изображения:

Это фотография моей собаки <IMG SRC="моя_собака.gif">.

Можно указать и полный URL, например:

< IMG SRC="http://www.someserver.com/lois/моя_собака.gif">.

Если изображение находится, например, в подкаталоге графика, то это будет выглядеть так:

< IMG SRC="/графика/моя_собака.gif">.

Поля вокруг изображений

Для определения расстояния между текстом и плавающими изображениями, а также между краем окна и изображениями используются атрибуты VSPACE и HSPACE. Атрибут VSPACE служит для определения пустого пространства над и под плавающим изображением, а атрибут HSPACE - для определения пустого пространства справа и слева от плавающего изображения. Величины VSPACE и HSPACE измеряются в пикселях в теге <IMG>.

 

 

Рис. 17

 

Порядок выполнения работы

 

1. найти в Интернете необходимые картинки и скопировуйте их в свою папку с работами.

2. Откройте текстовый редактор Блокнот

3. Введите программу для создания Web-страницы

 

4. Результат показан на рис 19.

5. Сохраните файл с именем Работа 7.HTML

 

Рис. 19

Контрольные вопросы

1. Чем отличаются встроенные изображения от плавающих?

2. Приведите синтаксис процедуры добавления к странице встроенного изображения.

3. Как определить расстояние между текстом и плавающим изображением?

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

5. Что такое изображение-ссылка?

Методические указания

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

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

Для создания структурного документа используется контейнер FRAMESET. Пара тегов <FRAMESET> </FRAMESET> полностью заменяет в структурном документе пару <BODY> </BODY>. В теге <FRAMESET> используются два атрибута: ROWS - страница будет разделена по горизонтали; COLS - страница будет разделена по вертикали. Для этих атрибутов используется следующий формат:

< FRAMESET ROWS="числа, проценты,* ">;

< FRAMESET COLS="числа, проценты,* ">.

Это означает, что необходимо выбрать значения в пикселях, процентах или просто *. Пример: создаются два горизонтальных фрейма - один имеет длину 50 пиксель, а другой - всю остальную часть страницы:

< FRAMESET ROWS="50,* ">.

В следующем примере создается страница, разделенная на два столбца, где левый занимает 25% экрана, а правый - остальные 75%:

< FRAMESET COLS="25%, 75%">.

В отдельном теге <FRAMESET> может использоваться только один из атрибутов - ROWS или COLS. Это означает, что фреймовая структура может состоять или только из строк, или только из столбцов. Чтобы создать строки внутри столбцов или наоборот, необходимы вложенные теги <FRAMESET>. Например:

< FRAMESET COLS="25%, 75%">

< FRAMESET ROWS="50%, 50%">

< /FRAMESET>

< FRAMESET ROWS="10%, 90%">

< /FRAMESET>

< /FRAMESET>.

Сначала страница была разделена на два столбца (левый - 25%, правый - 75%). Затем первый столбец был разделен на две строки по 50% пространства столбца. Второй столбец был разделен на две строки (первая - 10%, вторая - 90%).

Настройка фреймов

Атрибуты MARGINWIDTH и MARGINHEIGHT используются для определения правого/левого и верхнего/нижнего полей текста и графики внутри фрейма соответственно (рис. 20). Оба эти атрибута принимают числовые значения в пикселях. В следующем коде между содержимым файла text.html и границами фрейма определяется поле шириной 5 пиксель:

< FRAME SRC="text.html" MARGINMARGINHEIGHT=5>.

Атрибут SCROLLING может принимать значения yes, no, auto. Он позволяет определить, присутствуют ли в окне фрейма полосы прокрутки. По умолчанию принимается значение auto.

Атрибут NORESIZE не принимает никаких значений, он используется для того, чтобы не позволить пользователю изменить размеры окна фрейма. Пример использования атрибутов SCROLlING и NORESIZE:

< FRAME SRC="text.html" SCROLLING="no" NORSIZE>.

Рис. 20

Определение границ фрейма

Атрибут FRAMEBORDER можно использовать в теге <FRAMESET> либо <FRAME>. Он может принимать значения «yes» (по умолчанию) и «no» - означает отсутствие границ. С помощью атрибута BORDER можно определить ширину рамки в пикселях. Если установить значения FRAMEBORDER="no", а BORDER="0", то границы фреймов на вашей странице будут невидимыми.

В тегах <FRAMESET> и <FRAME> можно использовать атрибут BORDERCOLOR. С его помощью определяется цвет рамок (т.е. границ фреймов). По умолчанию границы фреймов имеют тускло-серый оттенок. При определении цвета можно использовать как его название, так и числовой эквивалент.

Приложение

СПРАВОЧНИК ПО HTML

Список тегов и атрибутов