Студопедия
Случайная страница | ТОМ-1 | ТОМ-2 | ТОМ-3
АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатика
ИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханика
ОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторика
СоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансы
ХимияЧерчениеЭкологияЭкономикаЭлектроника

Вставка таблиц. Верстка страниц.

Читайте также:
  1. X. Оператора манипулирования данными. Вставка данных
  2. Быстрая вставка неформатированной таблицы
  3. В зависимости от кроя украинские рубахи подразделяются на три типа: туникообразные, поликовые (с вставками), на кокетке.
  4. Вставка в документ готового рисунка
  5. Вставка вычисляемого поля
  6. Вставка декоративного текста в документ
  7. Вставка и удаление скобок

Вставка ссылок.

Ссылка или более полно «активная гипертекстовая ссылка» даёт возможность ссылаться в документе на приложенные файлы или на другие сайты или страницы сайта. Таким образом, при помощи ссылок возможно расширить возможности для посетителя сайта, наделив его возможностями навигации, то есть интерактивностью.

Для задания перехода по ссылке в языке HTML употребляются теги <a></a> с атрибутом href, значением которого является адрес перехода.

<a href=”адрес страницы, на которую ссылаемся” >текст, который увидит пользователь</a>

Если вы ссылаетесь на страницу, находящуюся на другом сайте, необходимо указывать ее полный адрес:

<a href=”http://news.yandex.ru/index.html”>Новости Яндекса</a>

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

<A HREF="photo/Лесное озеро.jpg"> здесь Вы можете полюбоваться прекрасным лесным озером </A>.

В данном случае файл Лесное озеро.jpg лежит в папке photo.

Упражнение.

1. В папке site создайте копию вашего файла index.html и переименуйте ее в p2.html

2. В конце вашей страницы index.html вставьте ссылку на p2.html (пользователь должен увидеть текст Вторая страница), а в конце страницы p2.html – ссылку на страницу index.html (пользователь должен увидеть текст Главная страница).

3. В любом месте вашей страницы index.html вставьте ссылку на любое изображение из вашей папки images


 

Вставка таблиц. Верстка страниц.

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

Типичный пример использования таблиц для представления числовых данных, разбитых по строкам и столбцам:


 

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

Header (Шапка)
Навигация     Основной контент     Дополнительный контент
Footer (подвал)

 

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

Для описания таблиц служит тег <TABLE></table>. Вся таблица заключена между открывающим и закрывающим тегом.

Основные атрибуты тэга <TABLE>:

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

Width (ширина таблицы) и height (высота таблицы) – значение этого атрибута - численное значение ширины всей таблицы в пикселях или в процентах от всего размера окна.

Bgcolor - устанавливает цвет фона таблицы.

Bordercolor - этот атрибут определяет цвет рамок в таблице.

Background - фоновый рисунок для таблицы

Тег <TR></tr> (сокращение от Table Row- строка таблицы) создаёт строку таблицы. Весь текст, другие теги и атрибуты, которые вы хотите поместить в одну строку, должны быть помещены между тегами <TR></tr>. тег <tr> может иметь и следующие атрибуты: Valign – отвечает за выравнивание по вертикали(top — выравнивание по верхнему краю строки, middle — выравнивание по середине, bottom — выравнивание по нижнему краю), Bordercolor и Bgcolor – аналогичны атрибутам тега <table>.

Тег <TD></td>. Внутри строки таблицы обычно размещаются ячейки с данными. Каждая ячейка, содержащая текст или изображение, должна быть окружена тегами <TD></TD>. Число тегов <TD></TD> в строке определяет число ячеек. Каждая ячейка таблицы, задаваемая через тег <td>, в свою очередь тоже имеет свои атрибуты, часть из которых совпадает с атрибутами тега <table>.

Align - Задает выравнивание содержимого ячейки по горизонтали. Возможные значения: left — выравнивание по левому краю, center — по центру и right — по правому краю ячейки.

Bgcolor устанавливает цвет фона ячейки. Используя этот атрибут совместно с атрибутом bgcolor тега <table> можно получить разнообразные цветовые эффекты в таблице.

Colspan - устанавливает число ячеек, которые должны быть объединены по горизонтали.

Rowspan - устанавливает число ячеек, которые должны быть объединены по вертикали.

Valign - устанавливает вертикальное выравнивание содержимого ячейки. По умолчанию содержимое ячейки располагается по ее вертикали в центре. Тop — выравнивание по верхнему краю строки, middle — выравнивание по середине, bottom — выравнивание по нижнему краю.

Width - задает ширину ячейки.

 


Дата добавления: 2015-07-10; просмотров: 138 | Нарушение авторских прав


<== предыдущая страница | следующая страница ==>
Правила синтаксиса| Пример.

mybiblioteka.su - 2015-2024 год. (0.008 сек.)