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

Updated the text and examples (#20968)

Browse Source 
Rewrote the text to be more descriptive and concise
Added an example for links in images
This commit is contained in:
EmeraldEntities
2018-11-04 23:03:02 -05:00
committed by Christopher McCormack
parent c136cb9606
commit 934c585a36
1 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
guide/english/html/tutorials/how-to-use-links/index.md
View File

@ -3,33 +3,34 @@ title: How to Use Links
--- ---
## How to Use Links ## How to Use Links
In HTML you can use the `<a>` tag to create a link. For example you can write `<a href="https://www.freecodecamp.org/">freeCodeCamp</a>` to create a link to freeCodeCamp's website. Links are found in many webpages and its purpose is to allow users to visit other webpages.
Links are found in nearly all web pages. Links allow users to click their way from page to page. <br/>In HTML, you can use the `<a>` tag to create a hyperlink.
HTML links are hyperlinks. You can click on a link and jump to another document.
When you move the mouse over a link, the mouse arrow will turn into a little hand.
Note: A link does not have to be text. It can be an image or any other HTML element.
In HTML, links are defined with the <a> tag:
```html ```html
<a href="url">link text</a> <a href="url">link text</a>
``` ```
The href attribute is very important, as it defines what the destination address is.
<br/>The link text is the actual visable text.
Example
<br/>For example, if you wanted something to link to the freeCodeCamp website, you could type:
```html
<a href="https://www.freecodecamp.org/">freeCodeCamp</a>
```
When run, this will display the text "freeCodeCamp", but it links to the website `"https://www.freecodecamp.org"`. Clicking on the text will send you to the specified address. Neat!
### Links in images
Links don't need to only be text. You can add a link to an image as well!
```html ```html
<a href="https://www.freecodecamp.org/">Visit our site for tutorials</a> <a href="https://www.freecodecamp.org"
<img src="freecodecamp.png" alt = "freeCodeCamp's logo">
</a>
``` ```
The href attribute specifies the destination address (https://www.freecodecamp.org) of the link. What we do here is we put an <img> tag inside of an <a> tag. This allows us to click the image to go to the link, which is `https://www.freecodecamp.org`. Double neato!
The link text is the visible part (Visit our site for tutorials).
Clicking on the link text will send you to the specified address.
#### More Information: #### More Information:
<!-- Please add any articles you think might be helpful to read before writing the article --> <!-- Please add any articles you think might be helpful to read before writing the article -->