Skip to content

Commit 94d50c5

Browse files
commit message: "Updated subproject commit hash in My-Web-Dev-Course"
1 parent cecb797 commit 94d50c5

15 files changed

+816
-0
lines changed

Video48/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Document</title>
7+
</head>
8+
<body>
9+
<!-- Exercise -->
10+
</body>
11+
</html>

Video49/Video50/index.html

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>CSS Filters</title>
7+
<style>
8+
/* img{
9+
filter:blur(10px);
10+
} */
11+
.img1{
12+
filter: brightness(150%) contrast(100%);
13+
filter: opacity(0.4);
14+
}
15+
.img2{
16+
filter: invert(1);
17+
}
18+
.img3{
19+
filter: grayscale(20%) sepia(10%);
20+
filter: drop-shadow(16px 16px 20px rgb(6, 81, 104));
21+
}
22+
</style>
23+
</head>
24+
<body>
25+
<div class="container">
26+
<img class="img1" src="https://img.freepik.com/free-photo/programming-background-with-person-working-with-codes-computer_23-2150010125.jpg?size=626&ext=jpg" alt="">
27+
<img class="img2" src="https://occ-0-8407-90.1.nflxso.net/dnm/api/v6/Z-WHgqd_TeJxSuha8aZ5WpyLcX8/AAAABfE18TvIDnfKNHi_MyS_xiHjBwAPesW0EBE_PMx2vmsY5iIYmijUj8lXfes9jtKcX5ggst9bAzpCZZs9NFTboCeOfzpFTOfcv38i.jpg?r=fcb" alt="" width="500px">
28+
<img class="img3" src="https://static.vecteezy.com/system/resources/thumbnails/038/970/645/small_2x/ai-generated-cute-adorable-baby-girl-lying-on-the-bed-photo.jpg" alt="">
29+
</div>
30+
</body>
31+
</html>

Video49/index.html

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>CSS Object fit and position</title>
7+
<style>
8+
.container{
9+
height:488px;
10+
width: 466px;
11+
border: 2px solid black;
12+
/* background: aquamarine; */
13+
background-position: center center;
14+
background-image: url(https://images.unsplash.com/photo-1575936123452-b67c3203c357?fm=jpg&q=60&w=3000&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D);
15+
}
16+
img{
17+
width: 466px;
18+
height: 488px;
19+
object-fit: contain;
20+
object-position: 10px 20px;
21+
/* object-position: buttom right; */
22+
/* object-fit: contain; */
23+
24+
}
25+
</style>
26+
</head>
27+
<body>
28+
<div class="container">
29+
<!-- <img src="https://images.unsplash.com/photo-1575936123452-b67c3203c357?fm=jpg&q=60&w=3000&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8aW1hZ2V8ZW58MHx8MHx8fDA%3D" alt=""> -->
30+
</div>
31+
32+
</body>
33+
</html>

Video51/index.html

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Document</title>
8+
<style>
9+
.box {
10+
height: 121px;
11+
width: 121px;
12+
background-color: red;
13+
border-radius: 70px;
14+
position: absolute;
15+
bottom: 0;
16+
left: 0;
17+
animation: animateX 3s linear infinite, animateY 1s ease-out infinite alternate;
18+
}
19+
@keyframes animatex{
20+
from{
21+
left: 0;
22+
23+
}
24+
to{
25+
left:100%;
26+
}
27+
}
28+
@keyframes animatey{
29+
from{
30+
bottom:0;
31+
}
32+
to{
33+
bottom:100%;
34+
}
35+
}
36+
</style>
37+
</head>
38+
39+
<body>
40+
<div class="container">
41+
42+
<div class="box">
43+
</div>
44+
</div>
45+
<!--
46+
47+
-->
48+
</body>
49+
50+
</html>

Video52/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Figma Detail</title>
7+
</head>
8+
<body>
9+
10+
</body>
11+
</html>
Loading

Video53/assets/Images/banner.jpg

305 KB
Loading
48.5 KB
Loading
4.49 KB
Loading

Video53/assets/Images/tv.png

11.2 KB
Loading

0 commit comments

Comments
 (0)