-= сам сделай сайт! =-

Руководство по Html.

Инструментарий. Основные понятия.

  • Ступенька 1 - "Основной инструментарий, учимся работать руками".
  • Ступенька 2 - "Хтмл - язык ли? Гуси, гуси , тэги, tag`и".
  • Ступенька 3 - "Обязательные тэги. Зачем телу голова, а голове тело?"

  • Простейшие.
    Ступенька 4 - "Раскрась сам. Изменяем цвет текста".
  • Ступенька 5 - "Как изменять цвет фона. Оранжевый галстук".
  • Ступенька 6 - "Параграфы. Учимся выравнивать текст".
  • Ступенька 7 - "Что такое заголовки и как задавать размер буковок".
  • Ступенька 8 - "Курсив, жирный текст, подчеркнутый и другие".
  • Ступенька 9 - "Что такое путь?" Как вставлять картинки".
  • Ступенька 10 - "Что можно сделать с картинкой".
  • Ступенька 11 - "Ссылка и как с нею бороться".
  • Ступенька 12 - "Может ли картинка быть ссылкой".
  • Ступенька 13 - "Куда податься, на что ссылаться. Новое окно".
  • Ступенька 14 - "Что такое списки, или Он меня посчитал".
  • Ступенька 15 - "О линиях. Просто и полезно".
  • Ступенька 16 - "Спецсимволы или Головная боль".

    Таблицы.
  • Ступенька 17 - "Учимся создавать таблицы".
  • Ступенька 18 - "Учимся создавать таблицы" продолжение.
  • Ступенька 19 - "Таблицы, вертикальное выравнивание (valign)".
  • Ступенька 20 - "Таблицы, учимся растягивать ячейки (rowspan, colspan)"
  • Ступенька 21 - "Таблицы, что такое cellspacing и cellpadding. Что делать с пространством".
  • Ступенька 22 - "Вложенные таблицы и некоторые нюансы".
  • Ступенька 23 - "О рамках таблиц, и брюзжание о таблицах напоследок".

    Фреймы.
  • Ступенька 24 - "Вступление. Зачем они (фреймы) нужны."
  • Ступенька 25 - "Учимся создавать фреймы".
  • Ступенька 26 - "Учимся создавать фреймы" продолжение.
  • Ступенька 27 - "Учимся создавать фреймы" продолжение.
  • Ступенька 28 - "Параметры тэга Frame. Убираем полосу прокрутки, избавляемся от рамок, регулируем ширину полей фрейма".
  • Ступенька 29 - "Как делать так, чтобы при нажатии на ссылку документ открывался в другом фрейме, в полное окно".
  • Ступенька 30 - "Последняя глава о фреймах. Что такое IFrame. Несколько ссылок напоследок.".

    Дополнительные.
  • Ступенька 31 - "Форматирование текста. Тэги Big, Small, Strike (или S), Sub и Sup" (крупный, малый текст, перечеркнутый, верхний и нижний индексы).
  • Ступенька 32 - Завершение обтекания текстом объекта (картинки).
  • Ступенька 33 - Навигационные карты. Map. Как сделать часть картинки ссылкой.
  • Ступенька 34 - Навигационные карты 2.
  • Ступенька 35 - Навигационные карты 3.
  • Ступенька 36 - Ссылка внутри документа, якоря, anchor.
  • Ступенька 37 - Как убрать отступы (поля) документа, topmargin, leftmargin, marginwidth, marginheight.
  • Ступенька 38 - Cпецифические теги, бегущая строка текста.

    Примечания.
  • Примечание (1) - Как сохранить документ, как html-файл в блокноте.
  • Примечание (2) - Несколько ссылок на тему "История HTML".
  • Примечание (8) - Работа со шрифтами (ссылки).
  • Примечание (11) - Подсказка к текстовой ссылке
  • Примечание (11) - Дополнительные опции Mailto.
  • Примечание (12) - Как задавать цвет рамок вокруг картинки? И нужны ли рамки?
  • Примечание (24) - "Фреймы хорошо, или все же плохо?"

    Карта сайта
    Всё о PHP

  •  
     

    Главная | Оглавление | Словарь

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

    Способ первый - с помощью атрибута name (имя закладки) тега A:

    <H2>Григорий Остер, "Вредные советы.<BR>
    Книга для непослушных детей и их родителей".</H2>
    <A href="#stih1">Ссылка на стих первый</A><BR>
    <A href="#stih2">Ссылка на стих второй</A><BR>
    <A href="#stih3">Ссылка на стих третий</A><BR><BR>
    <PRE>
    Недавно ученые открыли, что на свете бывают непослушные дети, которые все делают наоборот. Им дают полезный совет: "Умывайтесь по утрам" - они берут и не умываются. Им говорят: "Здоровайтесь друг с другом" - они тут же начинают не здороваться. Ученые придумали, что таким детям нужно давать не полезные, а вредные советы. Они все сделают наоборот, и получится как раз правильно.
    </PRE>
    <H3><A name="stih1">Стих первый</A></H3>
    <PRE>
    ... тра-ля-ля 1...
    </PRE>
    <H3><A name="stih2">Стих второй</A></H3>
    <PRE>
    ... тра-ля-ля 2...
    </PRE>
    <H3><A name="stih3">Стих третий</A></H3>
    <PRE>
    ... тра-ля-ля 3...
    </PRE> (прим.)

    Заголовки (стих первый, стих второй, стих третий) в нашем примере мы сделали закладками, использовав параметр тега A - name:

    <A name="stih3">Стих третий</A>

    Затем, без стеснения, мы сделали на них ссылки:

    <A href="#stih3">Ссылка на стих третий</A>

    Заметьте - <A href="#stih3"> - символ решетки (#) перед именем закладки, на которую мы ссылаемся, обязателен. Вы можете ссылаться на закладку и из других документов, тогда ссылка будет выглядеть следующим образом:

    <A href="ancorpri.html#stih3"> Ссылка на стих третий из какого-то другого документа </A>

    или

    <A href="http://www.mysite.ru/ancorpri.html#stih1"> Ссылка на стих третий из какого-то другого документа </A>

    Способ второй - есть такой атрибут (параметр) - id, который назначает тегу (элементу) уникальное имя в пределах одного документа (кроме тегов Base, Head, Html, Meta, Script, Style, Title). Что мешает нам задать id, например, тегу H3 (заголовкам)?

    <H2>Григорий Остер, "Вредные советы.<BR>
    Книга для непослушных детей и их родителей".</H2>
    <A href="#stih1">Ссылка на стих первый</A><BR>
    <A href="#stih2">Ссылка на стих второй</A><BR>
    <A href="#stih3">Ссылка на стих третий</A><BR><BR>
    <PRE>
    Недавно ученые открыли, что на свете бывают непослушные дети, которые все делают наоборот. Им дают полезный совет: "Умывайтесь по утрам" - они берут и не умываются. Им говорят: "Здоровайтесь друг с другом" - они тут же начинают не здороваться. Ученые придумали, что таким детям нужно давать не полезные, а вредные советы. Они все сделают наоборот, и получится как раз правильно.
    </PRE>
    <H3 id="stih1">Стих первый</H3>
    <PRE>
    ... тра-ля-ля 1...
    </PRE>
    <H3 id="stih2">Стих второй</H3>
    <PRE>
    ... тра-ля-ля 2...
    </PRE>
    <H3 id="stih3">Стих третий</H3>
    <PRE>
    ... тра-ля-ля 3...
    </PRE> (прим.)

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

    Также хочу вас преостеречь, никогда не делайте так:

    <A href="#stih">Ссылка на ...</A><BR>
    ...
    <A name="STIH">Закладка</A>

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

    На этом мучения с закладками закончены, а напоследок ловите две ссылочки:

    - Не взлетим, так поплаваем. Уберите якоря со своих сайтов
    - Анкор, еще анкор
    - Koje-shto pro jakorja.

    Назад | Шагнуть на следующую ступеньку

    Свежие цветы оптом Низкие цены!.

    Hosted by uCoz