{"type":"doc","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"Фрагмент (якорь, anchor)"},{"type":"text","text":" — это часть ссылки, которая позволяет "},{"type":"text","marks":[{"type":"bold"}],"text":"переходить не на всю страницу, а к конкретному месту внутри неё"},{"type":"text","text":"."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Как это работает"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Фрагмент обозначается символом "},{"type":"text","marks":[{"type":"code"}],"text":"#"},{"type":"text","text":" и идентификатором элемента ("},{"type":"text","marks":[{"type":"code"}],"text":"id"},{"type":"text","text":"), к которому нужно перейти."},{"type":"hardBreak"},{"type":"text","text":"Когда пользователь кликает на такую ссылку, браузер "},{"type":"text","marks":[{"type":"bold"}],"text":"прокручивает страницу"},{"type":"text","text":" до нужного элемента."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Пример:"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"Перейти к контактам\n\n

Контакты

Телефон, адрес, почта...

\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"При нажатии на ссылку страница плавно прокрутится до заголовка с "},{"type":"text","marks":[{"type":"code"}],"text":"id=\"contact\""},{"type":"text","text":"."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Фрагменты могут быть:"}]},{"type":"orderedList","attrs":{"start":1,"type":null},"content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"Внутренними"},{"type":"text","text":" (ссылка на ту же страницу):"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"Наверх\n

\n"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"Внешними"},{"type":"text","text":" (ссылка на якорь на другой странице):"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"Наша команда\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Здесь произойдёт переход на страницу "},{"type":"text","marks":[{"type":"code"}],"text":"about.html"},{"type":"text","text":" и прокрутка к элементу с "},{"type":"text","marks":[{"type":"code"}],"text":"id=\"team\""},{"type":"text","text":"."}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 Особенности:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Якорь "},{"type":"text","marks":[{"type":"bold"}],"text":"не требует отдельного файла"},{"type":"text","text":" — он ссылается на элемент по атрибуту "},{"type":"text","marks":[{"type":"code"}],"text":"id"},{"type":"text","text":"."}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Не чувствителен к регистру ("},{"type":"text","marks":[{"type":"code"}],"text":"#Contact"},{"type":"text","text":" и "},{"type":"text","marks":[{"type":"code"}],"text":"#contact"},{"type":"text","text":" — одно и то же)."}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Используется для "},{"type":"text","marks":[{"type":"bold"}],"text":"удобной навигации"},{"type":"text","text":" по длинным страницам, меню, оглавлениям, FAQ и т.д."}]}]}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔸 Вывод:"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"Фрагмент (якорь)"},{"type":"text","text":" — это внутренняя метка на странице, которая создаётся через "},{"type":"text","marks":[{"type":"code"}],"text":"id"},{"type":"text","text":" и позволяет ссылке с "},{"type":"text","marks":[{"type":"code"}],"text":"#"},{"type":"text","text":" моментально перенести пользователя к нужному месту без перезагрузки страницы."}]}]}

Что такое фрагмент | якорь (anchor) в ссылке?

Комментарии