Html-Learning-Code/anchor.html at master · iiamvk/Html-Learning-Code · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> Anchor tag tutorial</title>

<style type="text/css">
/* simple style applied by anchor tag */
 a
{
color:red;
display:block;
border-bottom:1px solid green;
padding:10px;
text-decoration:none;
font-weight:bolder;
margin:2px;
}
/* you can drag the mouse in link then
apply in the below style */
 .a1:hover
{
color:green;
background-color:white;
text-decoration:overline;
}
/* you can click the link to apply
the in thise style */
.a2:active
{
color:red;
background-color:black;
text-decoration:underline;
}
/* you can visite in thise link
then after apply the style */
.a3:visited
{
color:blue;
background-color:black;
}
</style>
</head>
<body>
<h1> hyper link </h1>
<!-- nav=the nav element id define
set of navigation link -->

<!-- you can create html link in web page
and website are any other internate server
then use anchor tag a.href=hyper refrens/hyper source link.
 _blank=Opens the linked document in a new window or tab.

 _self= Opens the linked document in the same frame.

 _parent= Opens the linked document in the parent frame.

 _top=Opens the linked document in the full body of the window.

 targetframe=Opens the linked document in a named targetframe


 -->
<a class="a1" href="http://www.google.com"
target="_blank"> jump to google</a>
<br><br><br><br><wbr>&nbsp;&nbsp;
<a class="a2" href="http://www.youtube.com"
target="_blank"> go to youtube
</a>

	<a class="a3" href="/html/index.htm" target="_blank" >HTML Tutorial</a>

<br> <wbr>
<p><a href="#C4">Jump to Chapter 4</a></p>

<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 2</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 3</h2>
<p>This chapter explains ba bla bla</p>

<h2 id="C4">Chapter 4</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 5</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 6</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 7</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 8</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 9</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 10</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 11</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 12</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 13</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 14</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 15</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 16</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 17</h2>
<p>This chapter explains ba bla bla</p>

<a href="file/10.png" download>
<img src="file/10.png" alt="myimage"
style="width:300px; height:250px;"> </a>

</body>
</html>