-
Notifications
You must be signed in to change notification settings - Fork 28
/
Html basic
100 lines (94 loc) · 2.51 KB
/
Html basic
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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="free notes for 12std science in pdf from for free download and free for all anyone can download the notes and free to use ultimate notes all Answer in one website ">
<meta name="author" content="noobstudent Aman's notes for students"
<meta name="keywords" content="free notes for 12std , Aman's notes, Maharashtra 12std notes for free, 12std notes in pdf form , noobstudent , noobstudent notes , noobstudents.tk">
<title>Free notes</title>
<style>
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Poppins', sans-serif;
}
html,body{
display: grid;
height: 100vh;
place-items: center;
background: #000;
}
.btn a{
position: relative;
color: #f5f5f5;
height: 70px;
width: 220px;
display: block;
text-align: center;
border-radius: 10px;
text-decoration: none;
background-image: linear-gradient(115deg,#4fcf70,#fad648,#a767e5,#12bcfe,#44ce7b);
}
.btn a:hover{
animation: rotate 0.4s linear infinite;
}
@keyframes rotate {
100%{
filter: hue-rotate(-360deg)
}
}
.btn a span{
height: 88%;
width: 96%;
background: #111;
display: block;
position: absolute;
top: 50%;
left: 50%;
border-radius: 6px;
line-height: 62px;
font-size: 25px;
transform: translate(-50%, -50%);
}
</style>
</head>
<body>
<div class="btn">
<a href="bchp1.html"><span>Chp-1</span></a>
<br>
<a href="bchp2.html"><span>Chp-2</span></a>
<br>
<a href="bchp3.html"><span>Chp-3</span></a>
<br>
<a href="bchp4.html"><span>Chp-4</span></a>
<br>
<a href="bchp5.html"><span>Chp-5</span></a>
<br>
<a href="bchp6.html"><span>Chp-6</span></a>
<br>
<a href="bchp3.html"><span>Chp-7</span></a>
<br>
<a href="bchp8.html"><span>Chp-8</span></a>
<br>
<a href="bchp9.html"><span>Chp-9</span></a>
<br>
<a href="bchp10.html"><span>Chp-10</span></a>
<br>
<a href="bchp11.html"><span>Chp-11</span></a>
<br>
<a href="bchp12.html"><span>Chp-12</span></a>
<br>
<a href="bchp13.html"><span>Chp-13</span></a>
<br>
<a href="bchp14.html"><span>Chp-14</span></a>
<br>
<a href="bchp15.html"><span>Chp-15</span></a>
<br>
<a href="bchp16.html"><span>Chp-16</span></a>
<br>
</div>
</body>
</html>
Output: