Ступенька 20-ая.
В этой главе мы продолжим разговор о ссылках. Иногда возникает такая ситуация: нам нужно сделать ссылку не на другой документ, а внутри того же документа - закладку, в народе называемую якорем (смотрите пример, понажимайте там на ссылочки). Такая навигация внутри одного и того же документа весьма удобна. Создаваться она может двумя способами.
Способ первый - с помощью атрибута 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="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> |
На этом наши мучения с ссылками закончены. В следующих уроках мы познакомимся с таблицами. Для этого нам придется опустить несколько тем, таких как спецсимволы, линии, списки, бегущие строки и т.д. С этими темами мы ознакомимся позже.
Шагаем дальше, к таблицам.
