Make hyperlink in html

: The Anchor element

The HTML element (or anchor element), with its href attribute, creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a URL can address.

Try it

Attributes

This element’s attributes include the global attributes.

Causes the browser to treat the linked URL as a download. Can be used with or without a filename value:

• Without a value, the browser will suggest a filename/extension, generated from various sources:
  • The Content-Disposition HTTP header
  • The final segment in the URL path
  • The media type (from the Content-Type header, the start of a data: URL, or Blob.type for a blob: URL)
  • download only works for same-origin URLs, or the blob: and data: schemes.
  • How browsers treat downloads varies by browser, user settings, and other factors. The user may be prompted before a download starts, or the file may be saved automatically, or it may open automatically, either in an external application or in the browser itself.
  • If the Content-Disposition header has different information from the download attribute, resulting behavior may differ:
    • If the header specifies a filename , it takes priority over a filename specified in the download attribute.
    • If the header specifies a disposition of inline , Chrome and Firefox prioritize the attribute and treat it as a download. Old Firefox versions (before 82) prioritize the header and will display the content inline.

    The URL that the hyperlink points to. Links are not restricted to HTTP-based URLs — they can use any URL scheme supported by browsers:

    • Sections of a page with document fragments
    • Specific text portions with text fragments
    • Pieces of media files with media fragments
    • Telephone numbers with tel: URLs
    • Email addresses with mailto: URLs
    • While web browsers may not support other URL schemes, websites can with registerProtocolHandler()

    Hints at the human language of the linked URL. No built-in functionality. Allowed values are the same as the global lang attribute.

    A space-separated list of URLs. When the link is followed, the browser will send POST requests with the body PING to the URLs. Typically for tracking.

    How much of the referrer to send when following the link.

    • no-referrer : The Referer header will not be sent.
    • no-referrer-when-downgrade : The Referer header will not be sent to origins without TLS (HTTPS).
    • origin : The sent referrer will be limited to the origin of the referring page: its scheme, host, and port.
    • origin-when-cross-origin : The referrer sent to other origins will be limited to the scheme, the host, and the port. Navigations on the same origin will still include the path.
    • same-origin : A referrer will be sent for same origin, but cross-origin requests will contain no referrer information.
    • strict-origin : Only send the origin of the document as the referrer when the protocol security level stays the same (HTTPS→HTTPS), but don’t send it to a less secure destination (HTTPS→HTTP).
    • strict-origin-when-cross-origin (default): Send a full URL when performing a same-origin request, only send the origin when the protocol security level stays the same (HTTPS→HTTPS), and send no header to a less secure destination (HTTPS→HTTP).
    • unsafe-url : The referrer will include the origin and the path (but not the fragment, password, or username). This value is unsafe, because it leaks origins and paths from TLS-protected resources to insecure origins.

    The relationship of the linked URL as space-separated link types.

    Where to display the linked URL, as the name for a browsing context (a tab, window, or ). The following keywords have special meanings for where to load the URL:

    • _self : the current browsing context. (Default)
    • _blank : usually a new tab, but users can configure browsers to open a new window instead.
    • _parent : the parent browsing context of the current one. If no parent, behaves as _self .
    • _top : the topmost browsing context (the «highest» context that’s an ancestor of the current one). If no ancestors, behaves as _self .

    Note: Setting target=»_blank» on elements implicitly provides the same rel behavior as setting rel=»noopener» which does not set window.opener .

    Hints at the linked URL’s format with a MIME type. No built-in functionality.

    Deprecated attributes

    Hinted at the character encoding of the linked URL.

    Note: This attribute is deprecated and should not be used by authors. Use the HTTP Content-Type header on the linked URL.

    Used with the shape attribute. A comma-separated list of coordinates.

    Was required to define a possible target location in a page. In HTML 4.01, id and name could both be used on , as long as they had identical values.

    Note: Use the global attribute id instead.

    Specified a reverse link; the opposite of the rel attribute. Deprecated for being very confusing.

    The shape of the hyperlink’s region in an image map.

    Источник

    What is a Hyperlink? Definition for HTML Link Beginners

    

    Dionysia Lemonaki

    

    Links are a defining featute of the Web and you’ll find them everywhere.

    As their name suggests, they create links, or connections, between pages. This allows us to navigate quickly and easily from one webpage to another.

    You’ll find many types of links on the Web.

    There are links that go from one website to another. There are links that go from one page of a site to another page of the same site. And there are links that go from one section of a site to another section within the same site.

    This article goes over the definition of a hyperlink and how to create a variety of different links in HTML.

    What is a Hyperlink?

    A hyperlink, also called a link or web link, contains an address for a destination and acts as a reference to data. A user can easily follow, jump to, and be directed to the destination by either clicking, tapping on, or hovering over the link.

    A hyperlink can be a piece of text, an image, an icon, or a graphic that, when you click on it, points to and navigates you to a different webpage or document. It can also point to a specific section or element within the same webpage or document.

    Basically, hyperlinks are clickable pointers to a resource.

    For example this link to freeCodeCamp’s homepage is a hyperlink. When you click on the underlined text, the browser leaves this current page and redirects you there instead.

    Each Google search result is a hyperlink. When you click on one of them, you leave the search page and go to the result.

    Without hyperlinks, you would need to know each and every URL (Uniform Resource Locator) of every webpage on the Internet in order to visit them.

    Hyperlinks and HTML

    A hyperlink is an element in an HTML document.

    Hypertext is text with hyperlinks. The linked text (the reference to data) is called anchor text.

    You use anchor tags to create hyperlinks to other webpages. They create links: a clickable text or image that, when clicked, takes us to a new page or to a different part of the same page.

    HTML consists of hyperlinks. They are an essential and defining feature of the World Wide Web, and they’re what has made the Web so successful. They enabled the very idea of browsing.

    They give us the ability to connect a document to another document across different computers and networks.

    The idea initially originated from scolarly referencing and footnotes in scientific documents, but this lead to the discoverability of other people’s websites as time went on.

    Users could click between the pages of not only one author’s website, but through to other authors’ websites and move from one webpage to another. Anything could link to anything else, making navigating to different places on the Web easy. And this provided users with wider access to information.

    The World Wide Web is made up of trillions of hyperlinks linking trillions of webpages to each other, creating something that could resemble a very large spider web.

    How to Create an HTML Link

    Here’s an example of an HTML link tag:

    • The link element has an opening and closing tag.
    • The text the users see and can click on is between the opening and closing a tags – in this case freeCodeCamp Home Page . It’s called link text and it should be descriptive of where the link goes.
    • On the opening tag, , an href attribute is added, which is short for hypertext reference . The value of the href attribute specifies the desired URL you want the link to take users to when the link text is clicked.
    • Don’t forget the equals sign = and quotation marks «» that go along with the href attribute.

    Hyperlinks by default look different than regular plain text. This is done for usability purposes and to let users know that this is indeed a link.

    By default, the text will have a blue color with an underline. You can change this, however, by adding different CSS styles.

    On a computer, when you hover over a link, the pointer changes from an arrow into a hand to indicate something is clickable.

    This type of hyperlink in the example above links to other sites. It’s an external link, used to connect two pages from two completely different websites.

    In this case, the value of href is an absolute URL – that is a full web address of the site with its domain name.

    How to Link to a Different Page within a Site

    Internal links are links that direct the user to different pages of the same site. They don’t point to external sites.

    In such cases,the href attribute has a relative URL.

    In the above example we created a navigation that contains links to different pages of the same site. They point to the «About» page, the «Blog Posts» page, the «My projects» page, and the «Contact Me» page, respectively.

    We don’t need to specify the domain name and full URL in the href attribute in this case, as these files are relative to our project and current working directory.

    In this case all files are in the same folder and have the same hierarchical structure, so writing just the name of the file is enough.

    How to Create a Link to a Specific Section of a Site

    What about when we want a link to jump to a specific part of the page?

    Maybe you mentioned a topic and want to refer readers to a section later on in the page where you talk about it in more detail.

    We can create links that connect content on the same page.

    First, go to the section you want the link to go to, and in the opening tag add an id attribute.

    For example maybe we have a paragraph we want to reference:

    Then in your link, append a # and the value you gave the id attribute, in this case extra-info :

    How to Open a Link in a New Tab

    When a link points to an external site, it is good practice to make it open in a separate tab. We don’t want to lose our site’s visitors.

    By default the browser opens links in the same tab.

    How to Create Email Links

    Links can do other actions aside from just linking to another page or website.

    For example, there are links that pop up and open the default email program and start a new email to a specified address.

    This time the href attribute starts with mailto: and then the email address you want to send a message to.

    The link by default doesn’t look any different than the other links we’ve talked about here. But when it’s clicked on, it automatically starts to compose a new email with the user’s default email client.

    When that happens, the to field is already filled out with the email address of where you want to send it to.

    Conclusion

    In this article, we went over the definition of a hyperlink and why they are such an important part of the Web.

    We also learned how to create different types of links in HTML.

    Thanks for reading and happy coding!

    Источник

    Читайте также:  Java native interface pdf