gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add other values of the target attribute (#20989)

Browse Source 
* Add other values of the target attribute

"_self" "_parent" "_top" _"targetframe"

* fixed grammar and formatting issues

* additional formatting corrections
This commit is contained in:
barrettfett
2018-11-07 14:34:24 -05:00
committed by Paul Gamble
parent 6a8959dc0b
commit d2c2fa0ce6
1 changed files with 21 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
guide/english/html/attributes/links/index.md
View File

@ -11,23 +11,40 @@ You use an anchor element/tag `<a>` to define your link, which also needs a dest
```html ```html
<a href="url">Link Text</a> <a href="url">Link Text</a>
``` ```
The target attribute can be used to tell the browser where to open the link. If you'd like your link to open in a new tab, you can use the `target` attribute along with the `_blank` value inside your opening `<a>` tag.
Here's a snippet that makes the phrase 'The freeCodeCamp Guide' a link: Here's a snippet that makes the phrase 'The freeCodeCamp Guide' a link:
```html ```html
<a href="https://guide.freecodecamp.org">The freeCodeCamp Guide</a> <a href="https://guide.freecodecamp.org">The freeCodeCamp Guide</a>
``` ```
The link ends up looking like this: [The freeCodeCamp Guide](https://guide.freecodecamp.org) The link ends up looking like this: [The freeCodeCamp Guide](https://guide.freecodecamp.org)
### Links in a New Tab ### `target` Attribute
If you'd like your link to open in a new tab, you'll use the `target` attribute along with the `"_blank"`
value inside your opening `<a>` tag. That looks like this: **Opening a page in a new tab**
If you'd like your link to open in a new tab, you'll use the `target` attribute along with the `_blank`
value inside your opening `<a>` tag:
```html ```html
<a href="url" target="_blank">Link Text</a> <a href="url" target="_blank">Link Text</a>
``` ```
Here is another example, using the official freeCodeCamp Guide as the `href=""` destination, and "The freeCodeCamp Guide" as the link text: Another example, using the official freeCodeCamp Guide as the `href=""` destination, and "The freeCodeCamp Guide" as the link text:
```html ```html
<!-- target="_blank" makes the link open in a new tab. --> <!-- target="_blank" makes the link open in a new tab. -->
<a href="https://guide.freecodecamp.org" target="_blank">The freeCodeCamp Guide</a> <a href="https://guide.freecodecamp.org" target="_blank">The freeCodeCamp Guide</a>
``` ```
Other values of the target attribute include:
- `_self` to open the linked document in the same frame
- `_parent` to open it in the parent frame
- `_top` opens the linked document in the full body of the window
- `_targetframe` opens the linked document in a named targetframe
### Links on the Same Page ### Links on the Same Page
When you need to guide users to a specific part of your webpage, let's assume the very bottom, you first need to create an html element with an `#id` that you want direct your user to - in this case the `<footer>` at the bottom of the webpage. For example: When you need to guide users to a specific part of your webpage, let's assume the very bottom, you first need to create an html element with an `#id` that you want direct your user to - in this case the `<footer>` at the bottom of the webpage. For example:
```html ```html