-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhtml19.html
67 lines (61 loc) · 1.98 KB
/
html19.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Buttons and Links</title>
<style>
*{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
.container{
border: solid red 4px;
padding: 34px;
margin: 34px auto;
width: 700px;
background-color: rgb(244, 244, 220);
/* font-size: 30px; */
}
.btn{
/* border: solid black 2px; */
/* background-color: yellow; */
padding: 6px;
border: none;
cursor: pointer ;
border-radius: 15px;
}
#button{
background-color: aqua;
width: 90px;
}
#link{
background-color: yellow;
width: 90px;
text-decoration: none;
color: black;
}
#link:hover{
background-color: orange;
}
#link:visited{
color: red;
}
#button:hover{
cursor: pointer;
background-color: darkblue;
color: yellow;
}
</style>
</head>
<body>
<div class="container">
<h2>
This is paragraph 1
</h2>
<p class="about">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iure voluptatem ipsa id! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Numquam facilis nostrum consequuntur aspernatur reprehenderit culpa dicta ipsa sit aperiam optio.Lorem ipsum dolor, sit amet consectetur adipisicing elit. Rem deleniti quod similique.</p>
<a href="https://www.youtube.com " target="_blank" class ="btn" id="link"> Read me</a>
<button class="btn" id="button">Next page</button>
</div>
</body>
</html>