9 |
Hire me
10 |
11 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/h.css:
--------------------------------------------------------------------------------
1 | .form-container{
2 | display: flex;
3 | justify-content: center;
4 | align-items: center;
5 | border: #333;
6 |
7 | }
8 |
9 | h1 {
10 | display: flex;
11 | justify-content: center;
12 | align-items: center;
13 | font-size: 70px;
14 |
15 |
16 | }
17 | .clr h2{
18 | font-size: 30px;
19 | font-family:Georgia;;
20 | }
21 | h2 span{
22 | color:red;
23 | }
24 | span{
25 | color:yellow;
26 | }
27 | body{
28 | background-image: url('hme.png');
29 | background-size: cover;
30 | background-position: center;
31 | }
32 |
33 | #me{
34 | background: rgba(255, 255, 255, 0.852);
35 | padding: 20px;
36 | margin: 20px;
37 | border-radius: 8px;
38 | color: #333;
39 | max-width: 600px;
40 | margin: 0 auto;
41 | }
--------------------------------------------------------------------------------
/astyle.css:
--------------------------------------------------------------------------------
1 | .sec2{
2 | margin-left: 8%;
3 | margin-top: 13%;
4 |
5 |
6 | }
7 |
8 |
9 | .sec2 h1{
10 | font-size: 60px;
11 | font-family:Georgia;
12 | margin-bottom: 20px;
13 | }
14 |
15 | span{
16 | color:Red;
17 | }
18 |
19 | .sec2 p{
20 | line-height: 22px;
21 |
22 | }
23 |
24 | .sec2 button a{
25 | text-decoration:none;
26 | color:black;
27 | font-weight: bold;
28 | }
29 |
30 |
31 |
32 | .sec2 img{
33 | background-color: silver;
34 | width: 10%;
35 | height: 15%;
36 | position: relative;
37 | }
38 |
39 | .images{
40 | width:40%;
41 | height:70%;
42 | position: absolute;
43 | bottom: 10%;
44 | top:20%;
45 | right: 50px;
46 |
47 | }
48 |
49 | .images img{
50 | height: 100%;
51 | width: 100%;
52 | position:relative;
53 | left:70%;
54 | top:10%;
55 | transform:translate(-50%);
56 | transition: bottom 1s,left 1s;
57 | }
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
--------------------------------------------------------------------------------
/about.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
8 | 
15 |
16 |
17 |
21 |
22 |
31 |
32 |
--------------------------------------------------------------------------------
/portfolio.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | I'm Ragavan R
9 |This is my official portfolio website.
10 |
I'm a Student studying B.tech Informtion Technology in K.Ramakrishnan College of Engineering,Trichy.
11 |
Current I'm studying in 3rd year.
12 |
Skills
14 |
15 | 16 |
17 |
18 | 
19 |
20 |
19 | 21 |
22 |
Achievements
23 |-
24 |
- Certified in Mobile Application in 2024
- Certified in Python (Basics) in Skillrack
- Certified in C Language offered by linked-In
25 |
26 |
27 | 28 |
7 |
16 |
34 | 35 |
42 |
43 |
44 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | {
2 | margin:0;
3 | padding:0;
4 | font-family:sans-serif;
5 | }
6 |
7 | .sec1{
8 | position:absolute;
9 | width:100%;
10 | height:100vh;
11 | background:#eff4fd;
12 | }
13 |
14 | nav{
15 | display:flex;
16 | width:84%;
17 | margin:auto;
18 | padding:20px 0;
19 | align-items:center;
20 | justify-content:space-between;
21 |
22 | }
23 |
24 | nav ul li{
25 | display:inline-block;
26 | list-style: none;
27 | margin:10px 20px;
28 |
29 | }
30 |
31 |
32 | nav ul li a{
33 | text-decoration:none;
34 | color:black;
35 | font-weight: bold;
36 |
37 | }
38 |
39 | nav ul li a:hover{
40 | color:blue;
41 | }
42 |
43 | nav img{
44 | width:20%;
45 | height:20%;
46 | position:relative;
47 | margin-right: 20%;
48 | }
49 |
50 | .cl2{
51 | margin-left: 8%;
52 | margin-top: 13%;
53 | }
54 |
55 | .cl2 h1{
56 | font-size: 60px;
57 | font-family:Georgia;
58 | margin-bottom: 20px;
59 | }
60 |
61 | span{
62 | color:red;
63 | }
64 |
65 | .cl2 p{
66 | line-height: 22px;
67 | }
68 |
69 | .images{
70 | width:45%;
71 | height:80%;
72 | position: absolute;
73 | bottom: 0%;
74 | top:20%;
75 | right: 50px;
76 |
77 | }
78 |
79 | .cl2 button{
80 | background: black;
81 | padding: 10px 18px;
82 | text-decoration: none;
83 | font-weight: bold;
84 | color:#fff
85 | dispay:inline-block;
86 | margin:30px o;
87 | border-radius: 5px;
88 | }
89 |
90 | .images img{
91 | height: 100%;
92 | position:relative;
93 | left:50%;
94 | top:10%;
95 | transform:translate(-50%);
96 | transition: bottom 1s,left 1s;
97 | }
98 |
99 |
100 | .sec3 img{
101 | width:3%;
102 | height: 5%;
103 | position: relative;
104 | }
105 |
106 |
--------------------------------------------------------------------------------
17 |
30 | I'm Ragavan
18 |This is my official portfolio website.
19 |
I attached my resume and other details in my website
20 |
I'm open to work and developing my Knowledge and learn new things
21 |
22 |
31 | 
32 |
33 |
32 | 34 | 35 |
36 | 
37 |
38 |
39 |
40 |
41 |
37 |
38 |
39 | 40 |