-
Notifications
You must be signed in to change notification settings - Fork 0
/
tutorial-10.html
53 lines (49 loc) · 1.43 KB
/
tutorial-10.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
<!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>Pseudo Selector and Designing</title>
<style>
.container{
border: 2px solid darkred;
margin: 50px;
padding: 22px;
background-color: rgb(246, 232, 215);
border-radius: 8px;
}
a{
color: black;
text-decoration: none;
}
a:hover{
color: rgb(5, 0, 0);
background-color: rgb(243, 214, 145);
}
a:visited{
color: rgb(120, 69, 6);
}
a:active{
background-color: rgb(193, 213, 154);
}
.btn{
border: 2px solid blue;
background-color: rgb(221, 237, 237);
color: black;
padding: 5px;
cursor: pointer;
border-radius: 12px;
}
</style>
</head>
<body>
<div class="container">
<h2>This is my heading</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugiat magni modi voluptas ad eius cumque adipisci
sit. Similique corrupti quis, dicta architecto dignissimos impedit dolor reprehenderit cum error? Eligendi
corrupti maiores vel!</p>
<a href class="btn">Read More</a>
</div>
</body>
</html>