Go4Expert

Go4Expert (http://www.go4expert.com/)
-   Web Development (http://www.go4expert.com/forums/web-development-forum/)
-   -   How to create links to sections on the same page in HTML. (http://www.go4expert.com/forums/create-links-sections-page-html-t28308/)

Andy blunt 30Apr2012 16:33

How to create links to sections on the same page in HTML.
 
Hey If any one have idea for
How to create links to sections on the same page in HTML.

shabbir 1May2012 08:49

Re: How to create links to sections on the same page in HTML.
 
<A href should help you make links in html page.

bzforum 30May2012 11:44

Re: How to create links to sections on the same page in HTML.
 
If you are asking about Named Anchors this is a way to do it...

This would be the code to define the Section
PHP Code:

<a name="top">Top Section</a

The Name attribute of the A tag gives the Anchor a Name which can then be liked to with the below code

This would be the code to link to the Top Section
PHP Code:

<a href="#top">Go To Top</a

What ever name you have defined you need to href it with #< the Name you gave >

I hope you understood how it works..

Alex.Gabriel 30May2012 22:32

Re: How to create links to sections on the same page in HTML.
 
Quote:

Originally Posted by bzforum (Post 95349)
This would be the code to define the Section
PHP Code:

<a name="top">Top Section</a


Actualy #top must be defined as an id so correct code would be
PHP Code:

<a id="top">top</a

then to go on the top you must link it with
PHP Code:

<a href="#top">Go tot top of the page</a

@Andy blunt : You can use <a href="">text here</a> as shabbir said.

mfred90 5Jun2012 15:13

Re: How to create links to sections on the same page in HTML.
 
you cane use <a href="URL">your name </a>, you can also try

pein87 11Jun2012 03:08

Re: How to create links to sections on the same page in HTML.
 
Give the element and id and point to it via the href attribute for the link like so

HTML Code:

<a href="#mySection">MySection</a>
using the first example is for a to top link where the link remains empty. This method works better with less tag usage. An example of this in practice is below. Save it was index.html and open it up. Click one of the links t be taken down to that section.

HTML Code:

<!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>Untitled Document</title>
<style type="text/css">
div#l { width:100%; height:600px; background: #CCC; }
div#m { width:100%; height:600px; background: #999; }
div#n { width:100%; height:600px; background: #666; }
</style>
</head>

<body>

        <div id="links">
                <a href="#l">L section</a>
                    <a href="#m">M section</a>
                    <a href="#n">N section</a>
        </div>

        <div id="l">SomeText</div>

        <div id="m">SomeText</div>

        <div id="n">SomeText</div>

</body>
</html>



All times are GMT +5.5. The time now is 04:20.