-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
143 lines (137 loc) · 5.8 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Profile_Tanvir</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="/my_parsonal_website/img/favicon-16x16.png">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
</head>
<body>
<!---hero section start-->
<div class="hero">
<nav>
<h2 class="logo">Tanvir <span>Islam</span></h2>
<ul>
<li><a class="log" href="#">Home</a></li>
<li><a class="log" href="#">About Us</a></li>
<li><a class="log" href="#">Service</a></li>
<li><a class="log" href="#">Skills</a></li>
<li><a class="log" href="#">Contact US</a></li>
</ul>
<a href="#" class="btn">Subscribe</a>
</nav>
<div class="content">
<h4>Hello, my name is</h4>
<h1>Tanvir <span>Islam</span></h1>
<h3>I'm a <span class="auto-type"></span></h3>
<div class="newslatter">
<form action="">
<input type="email" name="email" id="mail" placeholder="">
<input type="submit" value="Let's Start">
</form>
</div>
</div>
</div>
<!--About section start-->
<section class="about">
<div class="main">
<img src="/img/android-chrome-512x512.png" alt="">
<div class="about-text">
<h2>About me</h2>
<h5>Developer<span>& Designer</span></h5>
<p>I am a front-end web developer. I can provide clean code and pixel perfect design. I also make the website more & more interactive with web animations.I can provide clean code and pixel perfect design. I also make the website more & more interactive with web animations.A responsive design makes your website accessible to all users, regardless of their device.</p>
<button type="button">Let's Talk</button>
</div>
</div>
</section>
<!--service srction start-->
<center>
<div class="container-1">
<div class="card">
<div class="face face1">
<div class="content1">
<img src="img\design_128.png">
<h3 class="h3">Design</h3>
</div>
</div>
<div class="face face2">
<div class="content1">
<p>Every website should be built with two primary goals: Firstly, it needs to work across all devices. Secondly, it needs to be fast as possible..</p>
<a href="#">Read More</a>
</div>
</div>
</div>
<div class="card">
<div class="face face1">
<div class="content1">
<img src="img\code_128.png">
<h3 class="h3">Code</h3>
</div>
</div>
<div class="face face2">
<div class="content1">
<p>Every website should be built with two primary goals: Firstly, it needs to work across all devices. Secondly, it needs to be fast as possible..</p>
<a href="#">Read More</a>
</div>
</div>
</div>
<div class="card">
<div class="face face1">
<div class="content1">
<img src="img\launch_128.png">
<h3 class="h3">Launch</h3>
</div>
</div>
<div class="face face2">
<div class="content1">
<p>Every website should be built with two primary goals: Firstly, it needs to work across all devices. Secondly, it needs to be fast as possible.</p>
<a href="#">Read More</a>
</div>
</div>
</div>
</div>
</center>
<!--Contact me-->
<div class="contact-me">
<p>Let Me Get A Beautiful Website</p>
<a class="button-two" href="#">Hire Me</a>
</div>
<!----fotter start---->
<footer>
<p class="pre">Tanvir Islam</p>
<p class="pre">For more HTML, css and coding tutorial - please Click on the link below to subscribe to my chnnel</p>
<div class="social">
<a href="https://web.facebook.com/Progeammer007" target="_blank"><i class="fab fa-facebook"></i></a>
<a href="https://www.instagram.com/tanvirislam1971/" target="_blank"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-dribbble"></i></a>
</div>
<p class="end">CopyRight By Tanvir Islam</p>
</footer>
<!----java script-->
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>
<script>
var typed3 = new Typed('.auto-type', {
strings: ['<strong>Web Developer</strong>', ' <strong>Web Designer</strong>', 'Web Master! '],
typeSpeed: 150,
backSpeed: 150,
smartBackspace: true, // this is a default
loop: true
});
</script>
<script>
var typed4 = new Typed('#mail', {
strings: ['Enter Your E-mail.....', ],
typeSpeed: 200,
backSpeed: 200,
attr: 'placeholder',
bindInputFocusEvents: true,
loop: true
});
</script>
</body>
</html>