НАША ГРУППА
  • Фотографии

  • История
    • ОБЩЕНИЕ

  • ЧАТ!

  • ФОРУМ

    • Крупнейший интернет магазин портативной техники всем зашедшим по этой ссылке скидки.

    Как создать свой сайт.

    СОДЕРЖАНИЕ

    создание простейшего документа HTML2

    Давайте, применим полученные знания на практике и создадим простейшую страничку. Запустите текстовый редактор, например "Блокнот" или "WordPad", откройте или создайте если еще не создали в вашей папке стартовый файл с именем index.html. Теперь мы расположим вверху странички приветствие, в правом верхнем углу разместим ссылку для отправки почты, а в левом нижнем углу расположим ссылку на ваш фотоальбом. Сначала пишем тег открытия HTML документа: <HTML> Затем описываем заголовок и тэг <BODY> с атрибутами, устанавливающими цвета текста, активной, не просмотренной и просмотренной ссылок, а так же рисунок фона - "Stars.gif"

    <HEAD> <TITLE>Моя домашняя страничка</TITLE> </head> <body bgcolor="#000000" background="Stars.gif" text="#ffffff" alink="#DDOOOO" link="#0000FF" vlink="#FF00FF"> Поместим теперь на первую строку приветствие, выравнив его по центру и определив его как заголовок второго уровня.

    <CENTER> <H2> Добро пожаловать на мою домашнюю страничку! </H2> </CENTER> Как вы помните, я говорил, что для позиционирования различных элементов на Web-странице используют таблицы. Создадим таблицу размером 2 на 2, шириной 100% и высотой 80%. Для каждой ячейки определим ширину 50% и высоту 50%. Во второй ячейке первой строки создадим ссылку для отправки почты. Для указания на гиперссылку используем картинку "snail.gif":

    <a href="mailto:support@narod.ru"> <img border="0" alt="Напиши мне письмо" height="84" width="92" src="snail.gif"> </a> Для указания на фотоальбом используем ссылку:

    <a href="PhotoAlbum.html"> Мой фотоальбом </a>

    В итоге наша таблица будет иметь вот такой код:

    <TABLE border="0" width=100% height="80%"> <TR height="50%"> <TD align="center" width=50%> </TD> <TD align="center" width=50%> <a href="mailto:support@narod.ru"> <img border="0" alt="Напиши мне письмо" height="84" width="92" src="snail.gif"> </a> </TD> </TR> <TR height="50%"> <td align="center" width=50%> <a href="PhotoAlbum.html" target="_blank"> Мой фотоальбом </a> </TD> <TD align="center" width=50%> </TD> </TR> </TABLE>

    Завершим нашу страничку закрывающими тэгами:

    </BODY> </HTML> Теперь будем создавать фотоальбом. Создайте в текущей папке, две папки: "PhotoAlbum" для Ваших фотографий, и "PreView" для уменьшенных фотографий, предназначенных для предварительного просмотра. Обратите внимание, что на многих серверах имеет большое значение регистр символов в названиях файлов. Это значит, что ссылки <a href="PhotoAlbum.html"> и <a href="photoalbum.html">, будут указывать на разные файлы. С помощью текстового редактора создайте в текущей папке файл "PhotoAlbum.html". Начнем его заполнять. Сначала создадим таблицу, например, 3 на 2. В каждой ячейке разместим фотографии для предварительного просмотра из папки "PreView", которые будут указывать на полные фотографии из папки "PhotoAlbum". При нажатии на маленькую картинку, в отдельном окне будет раскрываться полная фотография. Код странички с нашим фотоальбомом будет выглядеть следующим образом:

    <HTML> <HEAD> <TITLE>Мой фотоальбом</TITLE> </HEAD> <BODY> <TABLE border="0" width=100%> <CAPTION>Мои любимые фотографии</CAPTION> <tr> <td width=30% align="center"> <a href='PhotoAlbum/11.jpg' target='_blank'>

    ТРАДИЦИИ КАИ

  • День группы
    • ОСНОВНОЕ

  • школьникам

  • студентам

  • остальное
    • ОБРАТНАЯ СВЯЗЬ

  • Разработчики


    • Rambler's Top100
    Используются технологии uCoz