Target means in html

HTML Атрибут target

Для элементов area, атрибут target указывает, где открыть связанный документ.

Для элементов base, атрибут target указывает целевой объект по умолчанию для всех гиперссылок и форм на странице.

Для элементов form, атрибут target указывает имя или ключевое слово, указывающее, где должен отображаться ответ, полученный после отправки формы.

Применение

Атрибут target можно использовать для следующих элементов:

Примеры

Пример A

Атрибут target указывает, где открыть связанный документ:

Пример Area

Изображение-карта с кликабельными областями и целевым атрибутом:

usemap=»#planetmap»>

Пример Base

Указать цель по умолчанию для всех гиперссылок и форм на странице:

Пример Form

Отображение полученного ответа в новом окне или вкладке:

Поддержка браузеров

Атрибут target имеет следующую поддержку браузера для каждого элемента:

Элемент
a	Да	Да	Да	Да	Да
area	Да	Да	Да	Да	Да
base	Да	Да	Да	Да	Да
form	Да	Да	Да	Да	Да

Мы только что запустили
SchoolsW3 видео

ВЫБОР ЦВЕТА

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо:

Ваше предложение:

Спасибо Вам за то, что помогаете!

Ваше сообщение было отправлено в SchoolsW3.

ТОП Учебники

ТОП Справочники

ТОП Примеры

Получить сертификат

SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности.

Источник

HTML target Attribute

The target attribute specifies where to open the linked document:

Definition and Usage

The target attribute specifies where to open the linked document.

Browser Support

Syntax

Attribute Values

Value	Description
_blank	Opens the linked document in a new window or tab
_self	Opens the linked document in the same frame as it was clicked (this is default)
_parent	Opens the linked document in the parent frame
_top	Opens the linked document in the full body of the window
framename	Opens the linked document in the named iframe

❮ HTML tag

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

HTML Атрибут target

Атрибут target (от англ. «target» — «цель, мишень») указывает место (фрейм или окно браузера) в которое должен быть загружен, указанный ресурс.

Для элемента определяет имя фрейма, в котором будут открываться все ссылки.
Действие target в качестве атрибута элемента распространяется на все ссылки документа, кроме ссылок в которых это действие переопределяется собственными атрибутами target .

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

Синтаксис

Значения

_blank Загружает страницу в новую вкладку браузера. _self Загружает страницу в текущую вкладку. _parent Загружает страницу во фрейм-родитель; если фреймов нет, то это значение работает как _self . _top Отменяет все фреймы и загружает страницу в полном окне браузера; если фреймов нет, то это значение работает как _self .

Значение по умолчанию

Применяется к тегам

Отличия HTML 4.01 от HTML 5

В HTML 4.01 атрибут считался устаревшим и не рекомендован к использованию, в HTML 5 он полностью поддерживается.

Примеры использования:

Атрибут target (Элемент )

Пример HTML:

Открыть пример в фрейме
 

Атрибут target (Элемент )

Пример HTML:

Источник

HTML target Attribute

Display the response received in a new window or tab:

Definition and Usage

The target attribute specifies a name or a keyword that indicates where to display the response that is received after submitting the form.

The target attribute defines a name of, or keyword for, a browsing context (e.g. tab, window, or inline frame).

Browser Support

Syntax

Attribute Values

Value	Description
_blank	The response is displayed in a new window or tab
_self	The response is displayed in the same frame (this is default)
_parent	The response is displayed in the parent frame
_top	The response is displayed in the full body of the window
framename	The response is displayed in a named iframe

❮ HTML tag

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

:target

The :target CSS pseudo-class represents a unique element (the target element) with an id matching the URL’s fragment.

/* Selects an element with an ID matching the current URL's fragment */ :target  border: 2px solid black; > 

For example, the following URL has a fragment (denoted by the # sign) that points to an element called section2 :

http://www.example.com/index.html#section2

The following element would be selected by a :target selector when the current URL is equal to the above:

section id="section2">Examplesection> 

Syntax

Note: Due to a possible bug in the CSS specification, :target doesn’t work within a web component because the shadow root doesn’t pass the target element down to the shadow tree.

Examples

A table of contents

The :target pseudo-class can be used to highlight the portion of a page that has been linked to from a table of contents.

HTML

h3>Table of Contentsh3> ol> li>a href="#p1">Jump to the first paragraph!a>li> li>a href="#p2">Jump to the second paragraph!a>li> li> a href="#nowhere"> This link goes nowhere, because the target doesn't exist. a> li> ol> h3>My Fun Articleh3> p id="p1"> You can target i>this paragraphi> using a URL fragment. Click on the link above to try out! p> p id="p2"> This is i>another paragraphi>, also accessible from the links above. Isn't that delightful? p> 

CSS

p:target  background-color: gold; > /* Add a pseudo-element inside the target element */ p:target::before  font: 70% sans-serif; content: "►"; color: limegreen; margin-right: 0.25em; > /* Style italic elements within the target element */ p:target i  color: red; > 

Result

Pure-CSS lightbox

You can use the :target pseudo-class to create a lightbox without using any JavaScript. This technique relies on the ability of anchor links to point to elements that are initially hidden on the page. Once targeted, the CSS changes their display so that they are shown.

Note: A more complete pure-CSS lightbox based on the :target pseudo-class is available on GitHub (demo).

HTML

ul> li>a href="#example1">Open example #1a>li> li>a href="#example2">Open example #2a>li> ul> div class="lightbox" id="example1"> figure> a href="#" class="close">a> figcaption> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec felis enim, placerat id eleifend eu, semper vel sem. figcaption> figure> div> div class="lightbox" id="example2"> figure> a href="#" class="close">a> figcaption> Cras risus odio, pharetra nec ultricies et, mollis ac augue. Nunc et diam quis sapien dignissim auctor. Quisque quis neque arcu, nec gravida magna. figcaption> figure> div> 

CSS

/* Unopened lightbox */ .lightbox  display: none; > /* Opened lightbox */ .lightbox:target  position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; > /* Lightbox content */ .lightbox figcaption  width: 25rem; position: relative; padding: 1.5em; background-color: lightpink; > /* Close button */ .lightbox .close  position: relative; display: block; > .lightbox .close::after  right: -1rem; top: -1rem; width: 2rem; height: 2rem; position: absolute; display: flex; z-index: 1; align-items: center; justify-content: center; background-color: black; border-radius: 50%; color: white; content: "×"; cursor: pointer; > /* Lightbox overlay */ .lightbox .close::before  left: 0; top: 0; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.7); content: ""; cursor: default; > 

Result

Specifications

Browser compatibility

BCD tables only load in the browser

Источник