Презентацияпо Теме "Создание web-страницы.Структурирование таблиц. Оформление страницы при помощи табличной формы

• 1 слайд

  Создание Web- страницы
  Автор: Бурматова О.И.
  

• 2 слайд

  Картинки
  
  Картинки вставляются при помощи одиночного тега
  <img src="название файла.расширение">.
  третья версия понимает только gif и jpg, а пятая версия и выше понимают gif, jpg, png, bmp.
  Картинки можно помещать в абзацы (прямо в текст), сами по себе, в ячейки таблицы.
  Если вы укажете
  <img src="название файла.расширение"
  align="выравнивание">.
  "left" или "right» - будет обтекание текстом (с размещением картинки слева или справа).
  "center" - картинка расположется по центру страницы без обтекания.
  

• 3 слайд

  Ссылки
  
  Ссылка привязывается к какому-либо элементу страницы, к тексту или картинке, при клике на который происходит перемещение в указанное место.
  задаётся тегами <a> с параметром href="место назначения", и выглядит это так:
  <a href="место назначения">текст или объект ссылки</a>.
  Местом - может быть файл. Необходимо указать путь для файла и его название (всё с учётом регистра), не забыть про расширение. Файл может быть любым, как другой HTML, так и какой-нибудь архив, типа zip, rar и любой другой, исполняемый файл exe, картинка и вообще всё, что только бывает.
  Будьте осторожны, ссылки на exe-файлы могут быть не безопасны
  абсолютный путь имеет смысл указывать только на те файлы и страницы, которые лежат не том сайте, где находится ваша страница, а на другом.
  У ссылки может быть параметр title, в котором содержится всплывающая подсказка к ссылке:
  <a href="место назначения" title="всплывающая подсказка">текст или объект ссылки</a>.
  

• 4 слайд

  Якоря
  
  Якорь нужен для того, чтобы указать на вашей странице какое-либо конкретное место, куда будет ссылаться ссылка. Якорь так же ставится тегом <a>,
  <a name="имя якоря">текст</a>
  Между открывающимся и закрывающимся тегами можно вообще ничего не писать, главное - разместить якорь в нужном месте.
  Ссылаться на якорь надо так:
  <a href="#имя якоря">текст или объект ссылки</a>
  Или, если вы хотите сослаться на какую-нибудь другую html-страницу и попасть в то место, где стоит заданный якорь, это делается так:
  <a href="путь и имя файла.расширение#имя якоря">текст или объект ссылки</a>
  
  
  

• 5 слайд

  Структурирование таблиц.
  Оформление страницы
  при помощи
  табличной формы
  

• 6 слайд

  <TABLE WIDTH="50%" BORDER="6"
  CELLSPACING="6" CELLPADDING="20"
  ALIGN="center"
  BORDERCOLORLIGHT="Lime"
  BORDERCOLORDARK=«Green»
  BGCOLOR="#DFFFDF">
  <TR>
  <ТD> Это уже таблица</ТD>
  </TR>
  </TABLE>
  

• 7 слайд

  <TABLE WIDTH="50%" BORDER="6"
  CELLSPACING="6" CELLPADDING="20"
  ALIGN="center"
  BORDERCOLORLIGHT="Lime"
  BORDERCOLORDARK=«Green»
  BGCOLOR="#DFFFDF">
  <TR>
  <ТD> Это первая ячейка</ТD>
  <ТD> Это вторая ячейка</ТD> </TR>
  </TABLE>
  

• 8 слайд

  <TABLE WIDTH="50%" BORDER="6" CELLSPACING="6"
  CELLPADDING="20"
  ALIGN="center" BORDERCOLORLIGHT="Lime"
  BORDERCOLORDARK="Green"
  BGCOLOR="#DFFFDF">
  <TR>
  <ТD> Это первая ячейка первой строки</ТD>
  <ТD> Это вторая ячейка первой строки </ТD> </TR>
  <TR>
  <ТD> Это первая ячейка второй строки </ТD>
  <ТD> Это вторая ячейка второй строки </ТD> </TR>
  </TABLE>
  

• 9 слайд

  Объединенные ячейки
  COLSPAN= (для объединения соседних
  столбцов)
  ROWSPAN= (для объединения соседних
  строк)
  ПРИМЕР:
  ROWSPAN="3"
  COLSPAN="2"
  

• 10 слайд

  ПРИМЕР ПРОГРАММЫ
  <TABLE WIDTH="50%" BORDER="6" CELLSPACING="6"
  CELLPADDING="20" ALIGN="center" BORDERCOLORLIGHT="Lime"
  BORDERCOLORDARK="Green" BGCOLOR="#DFFFDF">
  <TR>
  <TD WIDTH="33%">Этo 1 ячейка</ТD>
  <TD WIDTH="33%">Это 2 ячейка</ТD>
  <TD ROWSPAN="3">A это три ячейки третьего столбца объединились в одну большую ячейку</ТD>
  </TR>
  <TR>
  <TD COLSPAN="2">Это единственная ячейка второй строки, объединяющая оба столбца</ТD>
  </TR>
  <TR>
  <TD> первая ячейка третьей строки</ТD>
  <TD> A это вторая ячейка третьей строки</ТD>
  </TR>
  </TABLE>
  

• 11 слайд

• 12 слайд

  Практическая работа
  Создать Web-страницу, используя таблицу по заданному образцу:
  
  
  
  
  
  
  
  
  Наполнить страницу текстовой информацией
  
  

Краткое описание документа:

оформление web-страниц при помощи табличный форм