-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathTUT11.html
50 lines (42 loc) · 1.55 KB
/
TUT11.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
<!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>CSS SELECTORS</title>
<style>
#redYes {
color: red;
}
/* Grouping selector */
span,
footer {
color: chartreuse;
background-color: navy;
}
/* Element selector */
p {
border: 2px solid yellow;
}
</style>
</head>
<body>
<h1>CSS SELECTORS</SElect></h1>
<p>This is a simple para to demonstrate css selectors</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
Quam quaerat optio tenetur cupiditate? Consequuntur unde
natus earum, exercitationem nemo doloribus autem totam maiores distinctio, asperiores eos saepe, repellendus
placeat fugiat.
Eaque molestias earum perferendis autem quam ex quis optio voluptate fugiat. Asperiores labore in ut itaque hic
recusandae! Modi culpa corrupti quis nostrum saepe alias distinctio at mollitia sunt reiciendis.</p>
<!-- ONLY THIS WIILL TURN RED -->
<p id="redYes">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto eligendi corporis minus, quod alias
assumenda optio tenetur quae? Cupiditate earum voluptatum deserunt placeat beatae sed minus modi! Reiciendis,
reprehenderit mollitia?
</p>
<span> this is a span</span>
<footer>hey everyone i am a footer</footer>
</body>
</html>