-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathskill.html
150 lines (146 loc) · 7.76 KB
/
skill.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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Skills Page</title>
<link rel="icon" href="ico3.png" type="image/png">
<link rel="stylesheet" href="skill.css">
</head>
<body>
<center>
<h1>My Skills</h1>
</center>
<br>
<hr>
<center> <h2>Educational Skills</h2></center>
<hr>
<h3>HTML</h3>
<div class="container">
<button class="collapsible"><div class="skills html">90%</div></button>
<div class="content">
<br>
<marquee><Center><h2>HTML</h2></Center></marquee>
<p> <li>HTML stands for Hyper Text Markup Language</li>
<li>HTML is the standard markup language for creating Web pages</li>
<li>HTML describes the structure of a Web page</li>
<li>HTML consists of a series of elements</li>
<li>HTML elements tell the browser how to display the content</li>
<li>HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.</li></p>
</div>
</div>
<h3>CSS</h3>
<div class="container">
<button class="collapsible"><div class="skills css">80%</div></button>
<div class="content"><br>
<marquee><Center><h2>CSS</h2></Center></marquee>
<p>
<li>CSS stands for Cascading Style Sheets</li>
<li>CSS describes how HTML elements are to be displayed on screen, paper, or in other media</li>
<li>CSS saves a lot of work. It can control the layout of multiple web pages all at once</li>
<li>External stylesheets are stored in CSS files</li>
</p>
</div>
</div>
<h3>JavaScript</h3>
<div class="container">
<button class="collapsible"><div class="skills js">65%</div></button>
<div class="content"><br>
<marquee><Center><h2>JavaScript</h2></Center></marquee>
<p>
<li>JavaScript, often abbreviated as JS, is a programming language and core technology of the Web, alongside HTML and CSS.</li>
<li>99% of websites use JavaScript on the client side for webpage behavior.</li>
<li>Web browsers have a dedicated JavaScript engine that executes the client code.</li>
</p>
</div>
</div>
<h3>Bootstrap</h3>
<div class="container">
<button class="collapsible"><div class="skills Bootstrap">70%</div></button>
<div class="content"><br>
<marquee><Center><h2>Bootstrap</h2></Center></marquee>
<p>
<li>Bootstrap is a free front-end framework for faster and easier web development</li>
<li>Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins</li>
<li>Bootstrap also gives you the ability to easily create responsive designs</li>
</p>
</div>
</div>
<h3>React</h3>
<div class="container">
<button class="collapsible"><div class="skills React">50%</div></button>
<div class="content"><br>
<marquee><Center><h2>React</h2></Center></marquee>
<p>
<li>React is a declarative, efficient, and flexible JavaScript library for building user interfaces. It lets you compose complex UIs from small and isolated pieces of code called “components”.</li>
</p>
</div>
</div>
<h3>Java</h3>
<div class="container">
<button class="collapsible"><div class="skills Java">60%</div></button>
<div class="content"><br>
<marquee><Center><h2>Java</h2></Center></marquee>
<p>
<li>Java is a class-based, object-oriented programming language that is designed to have as few implementation dependencies as possible. It is intended to let application developers write once, and run anywhere (WORA), meaning that compiled Java code can run on all platforms that support Java without the need for recompilation. Java was first released in 1995 and is widely used for developing applications for desktop, web, and mobile devices. Java is known for its simplicity, robustness, and security features, making it a popular choice for enterprise-level applications.</li>
</p>
</div>
</div>
<h3>GitHub</h3>
<div class="container">
<button class="collapsible"><div class="skills GitHub">75%</div></button>
<div class="content"><br>
<marquee><Center><h2>GitHub</h2></Center></marquee>
<p>
<li>
GitHub is a web-based platform that uses Git, a version control system, to help developers manage and track changes in their code. It allows multiple people to collaborate on a project, track revisions, and contribute to code from anywhere in the world. GitHub offers both free and paid plans, catering to individuals and large organizations alike.</li>
</p>
</div>
</div>
<h3>PhotoShop 7.0</h3>
<div class="container">
<button class="collapsible"><div class="skills PhotoShop">70%</div></button>
<div class="content">
<br>
<marquee><Center><h2>PhotoShop 7.0</h2></Center></marquee>
<p>Photoshop is a photo-editing software. It is a popular image changing software package. It was developed in 1987 by the American brothers Thomas and John Knoll. There are two types of graphic software – Vector Graphic and Raster Graphic. This software provides many image editing features for raster (pixel-based) images as well as vector graphics. In technical language, Photoshop is a RASTER graphic software, which means it is used to edit the raster graphics. </p>
</div>
</div>
<h3>MS Office</h3>
<div class="container">
<button class="collapsible"><div class="skills MS-Office">85%</div></button>
<div class="content">
<br>
<marquee><Center><h2>MS Office</h2></Center></marquee>
<p>
<li>
Microsoft Office is a suite of applications designed to help with productivity and completing common tasks on a computer. You can create and edit documents containing text and images, work with data in spreadsheets and databases, and create presentations and posters.
</li>
</p>
</div>
</div>
<br>
<hr>
<div class="other-Skills">
<center><h2>Personal Skills</h2></center>
<hr>
<div class="wrapper">
<div class="box">
<ul class="ul-other-Skills">
<marquee behavior="alternate" scrollamount="20" scrolldelay="100"><li class="li-other-Skills">Good Communication</li></marquee>
<marquee behavior="alternate" scrollamount="15" scrolldelay="100"><li class="li-other-Skills">Problem solving</li></marquee>
<marquee behavior="alternate" scrollamount="25" scrolldelay="100"><li class="li-other-Skills">Creativity</li></marquee>
<marquee behavior="alternate" scrollamount="20" scrolldelay="100"><li class="li-other-Skills">Team leadership</li></marquee>
<marquee behavior="alternate" scrollamount="30" scrolldelay="100"><li class="li-other-Skills">Typing/word processing</li></marquee>
<marquee behavior="alternate" scrollamount="15" scrolldelay="100"><li class="li-other-Skills">Email managemen</li></marquee>
<marquee behavior="alternate"scrollamount="18" scrolldelay="100"><li class="li-other-Skills">Systems administration</li></marquee>
</ul>
</div>
</div>
</div>
<footer>
<p>© 2024 Ankit Saini. All Rights Reserved.</p>
</footer>
<script src="skill.js" defer></script>
</body>
</html>