How to specify the relationship between the current document and the target URL in HTML5 ?
We specify the relationship between the current document and the target URL by using a <link> tag in HTML. A link tag is used to define a link between a document and an external resource. It is used only when the href attribute is present.
Approach:
- To specify the relationship between the current and the linked document use the rel attribute
Attribute Values:
- alternate: It specifies the alternative link of the document(i.e. print page, translate, or mirror).
- author: It defines the author of the link
- dns-prefetch: It Specifies that the browser should preemptively perform DNS resolution for the target resource’s origin
- help: It specifies a link to a help document. Example: <link rel=”help” href=”/help/”>
- icon: It specifies an import icon in a given document
- license: It specifies a link to copyright information for the document
- next: It provides the link to the next document in series
- pingback: It specifies the address of the pingback serve
- preconnect: It specifies the target should be preemptive to the origin resource
- prefetch: It specifies that the target document should be cached.
- preload: It specifies that the browser must preemptively fetch and cache
- prerender: It specifies that the browser should load
- prev: It specifies the previous document in a selection
- search: It specifies the search tool for the document.
- stylesheet: It Imports a style sheet
Syntax:
<link rel="stylesheet" type="text/css" href="styles.css">
Example 1: In this example, we will specify the relationship between the current document and the target URL
HTML
<!DOCTYPE html>
< html >
< head >
< link rel = "stylesheet"
type = "text/css" href = "styles.css" >
</ head >
< body >
< h1 >GeeksforGeeks</ h1 >
< h2 >
How to specify the relationship between the current
document and the target URL in HTML5?
</ h2 >
</ body >
</ html >
|
CSS Code: The following is the content for the code “styles.css” used in the above HTML code.
h1 , h2
{
color:green;
text-align: center;
font-style: italic;
font-weight: bold;
}
Output:
link document
Example 2: In this example, we will see the use of <link> tag in HTML.
HTML
<!DOCTYPE html>
< html >
< head >
< link rel = "stylesheet"
type = "text/css"
href = "index_screen.css" >
< link rel = "stylesheet"
type = "text/css"
href = "index_print.css" >
</ head >
< body >
< center >
< h1 >GeeksforGeeks</ h1 >
target = "_blank" >
Click here
</ a >
</ center >
</ body >
</ html >
|
Output:
Last Updated :
06 Jun, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...