How to Create Link Same HTML Document, Which Scrolls Down to Desired Area on Click

Open text editing software., Create a new document., In your tag, populate anything that you would like, but concentrate on the linking portion., Give an element an ID., Save the document with either the extension .html or .htm. , Double click the...

9 Steps 1 min read Medium

Step-by-Step Guide

  1. Step 1: Open text editing software.

    You can use any text editor of your choosing, but here are a couple that are built in to the common OS's.

    Notepad (Windows) or TextEdit (OS X).
  2. Step 2: Create a new document.

    Start populating your code.

    The common base text is provided below: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML
    1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Place Your Title Here</title> </head> <body> Place Content Here </body> </html>

    A link tag is indicated by placing <a href="#id of element you want to link to">Place Description Here</a> where you would like the link to be. , Type ""id="" within the tag portion.

    Like so: <p id="Place Name Here">Content Here</p>. ,,,
  3. Step 3: In your <body> tag

  4. Step 4: populate anything that you would like

  5. Step 5: but concentrate on the linking portion.

  6. Step 6: Give an element an ID.

  7. Step 7: Save the document with either the extension .html or .htm.

  8. Step 8: Double click the document to open in your browser and test the link.

  9. Step 9: Congratulations if all went well you are done and can now create links in your web sites.

Detailed Guide

You can use any text editor of your choosing, but here are a couple that are built in to the common OS's.

Notepad (Windows) or TextEdit (OS X).

Start populating your code.

The common base text is provided below: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML
1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Place Your Title Here</title> </head> <body> Place Content Here </body> </html>

A link tag is indicated by placing <a href="#id of element you want to link to">Place Description Here</a> where you would like the link to be. , Type ""id="" within the tag portion.

Like so: <p id="Place Name Here">Content Here</p>. ,,,

About the Author

E

Emma Russell

Experienced content creator specializing in crafts guides and tutorials.

98 articles
View all articles

Rate This Guide

--
Loading...
5
0
4
0
3
0
2
0
1
0

How helpful was this guide? Click to rate: