Skip to content

Commit 32a7f73

Browse files
thenaveensaggamthenaveensaggam
committed
added
1 parent 0c83b21 commit 32a7f73

File tree

136 files changed

+6160
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

136 files changed

+6160
-0
lines changed

‎6PM_BATCH/CSS_Completed_Template/.idea/CSS_Completed_Template.iml‎

Lines changed: 12 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎6PM_BATCH/CSS_Completed_Template/.idea/modules.xml‎

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎6PM_BATCH/CSS_Completed_Template/.idea/workspace.xml‎

Lines changed: 576 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎6PM_BATCH/CSS_Completed_Template/01_CSS_COLORS.html‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS COLORS</title>
6+
<style>
7+
body{
8+
font-family: "Comic Sans MS",sans-serif;
9+
background-image: url("img/image4.jpeg");
10+
color: black;
11+
}
12+
div{
13+
height: 100px;
14+
}
15+
#rgb{
16+
background-color:rgb(98,47,5);
17+
}
18+
#hex{
19+
background-color: #622F05;
20+
}
21+
#hsl{
22+
background-color: hsl(27,90%,20%);
23+
}
24+
#rgba{
25+
background-color: rgba(98,47,5,0.5);
26+
}
27+
#hsla{
28+
background-color: hsla(27,90%,20%,0.5);
29+
}
30+
</style>
31+
</head>
32+
<body>
33+
34+
<!-- RGB -->
35+
<h2>RGB</h2>
36+
<div id="rgb"></div>
37+
38+
<!-- HEX -->
39+
<h2>HEX</h2>
40+
<div id="hex"></div>
41+
42+
<!-- HSL -->
43+
<h2>HSL</h2>
44+
<div id="hsl"></div>
45+
46+
<!-- RGBA -->
47+
<h2>RGBA</h2>
48+
<div id="rgba"></div>
49+
50+
<!-- HSLA -->
51+
<h2>HSLA</h2>
52+
<div id="hsla"></div>
53+
54+
</body>
55+
</html>

‎6PM_BATCH/CSS_Completed_Template/02_CSS_Backgrounds.html‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS Backgrounds</title>
6+
<style>
7+
body{
8+
font-family: "Comic Sans MS",sans-serif;
9+
}
10+
#bgImage{
11+
width: 500px;
12+
background-image: url("img/image5.jpeg");
13+
padding: 15px;
14+
}
15+
#bgPosition{
16+
height: 300px;
17+
width: 500px;
18+
background: lightgreen url("img/nature.jpg") no-repeat scroll right top;
19+
}
20+
#bgRepeat{
21+
height: 300px;
22+
width: 500px;
23+
background: lightgreen url("img/nature.jpg") repeat-x scroll right top;
24+
}
25+
#bgAttachment{
26+
height: 200px;
27+
width: 100%;
28+
background: white url("img/image5.jpeg") no-repeat fixed bottom;
29+
}
30+
</style>
31+
</head>
32+
<body>
33+
34+
<!-- BACKGROUND COLOR -->
35+
<h2>I am Teal color Background</h2>
36+
37+
<!-- BACKGROUND IMAGE -->
38+
<h2>BACKGROUND IMAGE</h2>
39+
<div id="bgImage">
40+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam animi architecto atque blanditiis, cupiditate delectus distinctio est et eum exercitationem ipsam labore laboriosam magni minus modi molestiae mollitia necessitatibus neque nihil optio perferendis quam quos sapiente sunt suscipit ullam vero?</p>
41+
</div>
42+
43+
<!-- BACKGROUND ATTACHMENT -->
44+
<h2>BACKGROUND ATTACHMENT</h2>
45+
<div id="bgAttachment"></div>
46+
47+
<!-- BACKGROUND POSITION -->
48+
<h2>BACKGROUND POSITION</h2>
49+
<div id="bgPosition"></div>
50+
51+
<!-- BACKGROUND REPEAT -->
52+
<h2>BACKGROUND REPEAT</h2>
53+
<div id="bgRepeat"></div>
54+
55+
</body>
56+
</html>

‎6PM_BATCH/CSS_Completed_Template/03_CSS_Borders.html‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS Borders</title>
6+
<style>
7+
body{
8+
font-family: "Comic Sans MS",sans-serif;
9+
}
10+
div{
11+
background-color: lightsalmon;
12+
text-align: center;
13+
padding: 10px;
14+
margin: 10px;
15+
width: 500px;
16+
}
17+
#rounded-all{
18+
border: 10px solid orangered;
19+
border-radius: 30px;
20+
}
21+
#rounded-two{
22+
border: 10px double orangered;
23+
border-top-left-radius: 50px;
24+
border-bottom-right-radius: 50px;
25+
}
26+
#movie{
27+
margin-bottom: 50px;
28+
border-top: 60px solid lightsalmon;
29+
border-right: 80px solid black;
30+
border-bottom: 60px solid lightsalmon;
31+
border-left: 80px solid black;
32+
padding: 0;
33+
background-color: black;
34+
box-shadow: 0 0 15px black;
35+
}
36+
</style>
37+
</head>
38+
<body>
39+
40+
<!-- BORDER TOP -->
41+
<div style="border-top: 10px solid orangered">
42+
<h1>BORDER TOP</h1>
43+
</div>
44+
45+
<!-- BORDER RIGHT -->
46+
<div style="border-right: 10px solid orangered">
47+
<h1>BORDER RIGHT</h1>
48+
</div>
49+
50+
<!-- BORDER BOTTOM -->
51+
<div style="border-bottom: 10px solid orangered">
52+
<h1>BORDER BOTTOM</h1>
53+
</div>
54+
55+
<!-- BORDER LEFT -->
56+
<div style="border-left: 10px solid orangered">
57+
<h1>BORDER LEFT</h1>
58+
</div>
59+
60+
<!-- BORDER ALL SIDES -->
61+
<div style="border: 10px solid orangered">
62+
<h1>BORDER ALL</h1>
63+
</div>
64+
65+
<!-- ROUNDER BORDER ALL SIDES -->
66+
<div id="rounded-all">
67+
<h1>ROUNDED ALL</h1>
68+
</div>
69+
70+
<!-- ROUNDED TWO SIDES -->
71+
<div id="rounded-two">
72+
<h1>ROUNDED TWO</h1>
73+
</div>
74+
75+
<!-- CUSTOM BORDER -->
76+
<div id="movie">
77+
<iframe width="500" height="300" src="https://www.youtube.com/embed/F8WmQIFpjqc?rel=0&amp;showinfo=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
78+
</div>
79+
80+
81+
</body>
82+
</html>

‎6PM_BATCH/CSS_Completed_Template/04_CSS_Margins.html‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS MARGINS</title>
6+
<style>
7+
body{
8+
font-family: "Comic Sans MS",sans-serif;
9+
}
10+
div{
11+
background-color: lightsalmon;
12+
width: 500px;
13+
padding: 10px;
14+
margin: 20px;
15+
text-align: center;
16+
text-transform: uppercase;
17+
box-shadow: 0 0 15px black;
18+
}
19+
p{
20+
border: 5px solid green;
21+
}
22+
</style>
23+
</head>
24+
<body>
25+
26+
<!-- MARGIN TOP -->
27+
<div>
28+
<p>margin</p>
29+
<p>margin</p>
30+
<p style="margin-top: 80px">margin top</p>
31+
<p>margin</p>
32+
</div>
33+
<!-- MARGIN RIGHT -->
34+
<div>
35+
<p>margin</p>
36+
<p>margin</p>
37+
<p style="margin-right: 80px">margin right</p>
38+
<p>margin</p>
39+
</div>
40+
41+
<!-- MARGIN BOTTOM -->
42+
<div>
43+
<p>margin</p>
44+
<p>margin</p>
45+
<p style="margin-bottom: 80px">margin bottom</p>
46+
<p>margin</p>
47+
</div>
48+
49+
<!-- MARGIN LEFT -->
50+
<div>
51+
<p>margin</p>
52+
<p>margin</p>
53+
<p style="margin-left: 80px">margin left</p>
54+
<p>margin</p>
55+
</div>
56+
57+
<!-- MARGIN ALL SIDES -->
58+
<div>
59+
<p>margin</p>
60+
<p>margin</p>
61+
<p style="margin: 80px">margin ALL</p>
62+
<p>margin</p>
63+
</div>
64+
</body>
65+
</html>

‎6PM_BATCH/CSS_Completed_Template/05_CSS_Paddings.html‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS paddingS</title>
6+
<style>
7+
body{
8+
font-family: "Comic Sans MS",sans-serif;
9+
}
10+
div{
11+
background-color: lightsalmon;
12+
width: 500px;
13+
padding: 10px;
14+
margin: 20px;
15+
text-align: center;
16+
text-transform: uppercase;
17+
box-shadow: 0 0 15px black;
18+
}
19+
p{
20+
border: 5px solid green;
21+
}
22+
</style>
23+
</head>
24+
<body>
25+
26+
<!-- padding TOP -->
27+
<div>
28+
<p>padding</p>
29+
<p>padding</p>
30+
<p style="padding-top: 80px">padding top</p>
31+
<p>padding</p>
32+
</div>
33+
<!-- padding RIGHT -->
34+
<div>
35+
<p>padding</p>
36+
<p>padding</p>
37+
<p style="padding-right: 80px">padding right</p>
38+
<p>padding</p>
39+
</div>
40+
41+
<!-- padding BOTTOM -->
42+
<div>
43+
<p>padding</p>
44+
<p>padding</p>
45+
<p style="padding-bottom: 80px">padding bottom</p>
46+
<p>padding</p>
47+
</div>
48+
49+
<!-- padding LEFT -->
50+
<div>
51+
<p>padding</p>
52+
<p>padding</p>
53+
<p style="padding-left: 80px">padding left</p>
54+
<p>padding</p>
55+
</div>
56+
57+
<!-- padding ALL SIDES -->
58+
<div>
59+
<p>padding</p>
60+
<p>padding</p>
61+
<p style="padding: 80px">padding ALL</p>
62+
<p>padding</p>
63+
</div>
64+
65+
</body>
66+
</html>

‎6PM_BATCH/CSS_Completed_Template/06_CSS-Outline.html‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSS OUTLINE</title>
6+
<style>
7+
.outline{
8+
background-color: lightsalmon;
9+
font-family: "Comic Sans MS",sans-serif;
10+
text-align: center;
11+
font-size: 50px;
12+
width: 500px;
13+
padding: 20px;
14+
border: 15px solid lightcoral;
15+
outline: 15px solid orangered;
16+
margin-left: 100px;
17+
}
18+
</style>
19+
</head>
20+
<body>
21+
<!-- CSS Outline Example -->
22+
<p class="outline">CSS Outline Example</p>
23+
24+
</body>
25+
</html>

0 commit comments

Comments
 (0)