Skip to content

Commit 47c9351

Browse files
committed
html and css initial commit
1 parent cb5b0b8 commit 47c9351

File tree

6 files changed

+134
-0
lines changed

6 files changed

+134
-0
lines changed

css/style.css

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
body {
2+
padding: 0;
3+
margin: 0;
4+
color: black;
5+
text-align: center;
6+
font-family: Helvetica, sans-serif;
7+
}
8+
9+
.home {
10+
background: whitesmoke;
11+
height: 100vh;
12+
}
13+
14+
.hills {
15+
margin: 0;
16+
width: 100%;
17+
position: absolute;
18+
bottom: -10px;
19+
left: 0;
20+
}
21+
22+
.name {
23+
color: blue;
24+
margin: auto;
25+
position: relative;
26+
top: 200px;
27+
font-weight: 1;
28+
font-size: 5rem;
29+
font-family: 'Sacramento', cursive;
30+
}
31+
32+
.para1 {
33+
color: blue;
34+
width: fit-content;
35+
margin: auto;
36+
top: 200px;
37+
position: relative;
38+
font-family: 'Overpass', sans-serif;
39+
40+
}
41+
42+
.dp {
43+
width: 20%;
44+
border-radius: 50%;
45+
padding: 20px;
46+
}
47+
48+
.profile {}
49+
50+
.skill-row {
51+
width: 50%;
52+
margin: 100px auto 100px auto;
53+
text-align: initial;
54+
line-height: 2;
55+
}
56+
57+
.skillgif {
58+
width: 25%;
59+
border-radius: 50%;
60+
margin-right: 30px;
61+
}
62+
63+
.gif1 {
64+
float: left;
65+
}
66+
67+
.gif2 {
68+
float: right;
69+
}

img/background.svg

Lines changed: 1 addition & 0 deletions
Loading

img/bg.png

341 KB
Loading

img/cloud.png

2.87 KB
Loading

img/rishabh.jpg

168 KB
Loading

index.html

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
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>Rishabh Rathore</title>
8+
<link rel="stylesheet" href="/css/style.css">
9+
<link href="https://fonts.googleapis.com/css2?family=Overpass&family=Sacramento&family=Yesteryear&display=swap"
10+
rel="stylesheet">
11+
<link href="https://fonts.googleapis.com/css?family=Sacramento&display=swap" rel="stylesheet">
12+
13+
14+
</head>
15+
16+
<body>
17+
18+
<div class="home">
19+
<h1 class="name">I'm Rishabh</h1>
20+
<p class="para1">Student -- Web Developer</p>
21+
<img class="hills" src="/img/bg.png" alt="hills">
22+
23+
24+
</div>
25+
<div class="profile">
26+
<img class="dp" src="/img/rishabh.jpg" alt="Rishabh.jpg">
27+
<h2>Hi there.</h2>
28+
<p>I am Rishabh Rathore. I am a student & a Web-Dev</p>
29+
</div>
30+
<hr>
31+
<div class="skills">
32+
<h2 class="skillhead">My Skills</h2>
33+
<div class="skill-row">
34+
<img class="skillgif gif1" src="https://media.giphy.com/media/ukMiDlCmdv2og/giphy.gif" alt="Web-D GIF">
35+
<h3>Web Development
36+
</h3>
37+
<p>I like to keep it simple and clean.
38+
Started Web-Development 3 months ago.
39+
</p>
40+
</div>
41+
<div class="skill-row">
42+
<img class="skillgif gif2" src="https://media.giphy.com/media/26tn33aiTi1jkl6H6/giphy.gif" alt="Python GIF">
43+
<h3>Python</h3>
44+
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ullam, architecto.</p>
45+
</div>
46+
</div>
47+
<hr>
48+
<div class="contact">
49+
<h2>Get In Touch</h2>
50+
<h3>Lorem ipsum dolor sit amet consectetur.</h3>
51+
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut.</p>
52+
<a href="mailto:[email protected]" class="button">Contact Me</a>
53+
</div>
54+
55+
<div class="bottom">
56+
<a class="footer-link" href="https://instagram.com/xerycks">Instagram</a>
57+
<a class="footer-link" href="https://twitter.com/xerycks">Twitter</a>
58+
<a class="footer-link" href="https://facebook.com/xerycks">Facebook</a>
59+
<p>©️ 2020 Rishabh Rathore</p>
60+
</div>
61+
62+
</body>
63+
64+
</html>

0 commit comments

Comments
 (0)