Read more
Darrel portfolio home page
Here is source code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
background-color:#373736;
width:100%;
height:100%;
border-radius:20px;
}
.navbar{
background-color:#333;
color:#333;
border-radius:20px;
padding:1px;
}
.navbar ul{
overflow:auto;
}
.navbar li {
list-style:none;
float:right;
margin:10px 16px;
padding:10px 10px;
}
.navbar li a{
text-decoration:none;
color:white;
padding:5px 6px;
margin:6px 5px;
font-size:20px;
cursor:pointer;
box-shadow: 0 0 20px white;
border-radius:10px;
}
.navbar li a:hover{
box-shadow: 0 0 20px #E356F4;
color:#E356F4;
}
.logo{
text-transform:uppercase;
float:left;
font-size:30px;
margin-top:-10px;
margin-left:20px;
cursor:pointer;
color:white;
letter-spacing:1.3px;
}
.logo span{
color:#E356F4;
}
.box{
width:900px;
height:900px;
margin-top:100px;
border:1px solid #975DB4;
margin-left:30px;
border-radius:30px;
box-shadow:10px 10px 20px 10px #975DB4;
animation:krishna 4s infinite;
}
.box img {
width:900px;
height:900px;
margin-left:px;
animation:krishna 4s infinite;
}
.heading1{
margin-left:450px;
margin-top:100px;
}
.heading1 h1{
font-size:100px;
color:white;
margin-left:-130px;
text-shadow:10px 10px 20px white;
}
.heading1 h2{
color:white;
text-shadow:2px 2px;
font-size:200px;
margin-left:-300px;
margin-top:-20px;
animation:krishna 4s infinite;
}
span{
color:#975DB4;
}
@keyframes krishna{
0%{
box-shadow:10px 10px 20px 10px #975DB4;
color:#975DB4;
}
25%{
box-shadow:10px 10px 20px 10px white;
color:#975DB4;
}
50%{
box-shadow:10px 10px 20px 10px black;
}
}
.bts{
width:600px;
height:150px;
margin-left:-250px;
margin-top:-60px;
border-radius:20px;
box-shadow:4px 4px black;
color:white;
animation:krishna 4s infinite;
}
.bts a{
color:#975DB4;
text-decoration:none;
font-size:60px;
}
.bts a:hover{
color:black;
}
.expression{
margin-top:2000px;
}
.expression h1{
margin-left:-280px;
}
.daba{
width:600px;
height:600px;
border:1px solid #975DB4;
margin-left:-250px;
border-radius:20px;
animation:krishna 4s infinite;
margin-top:20px;
}
.daba h1{
color:yellow;
margin-left:120px;
}
.daba h3{
color:yellow;
margin-left:10px;
font-size:30px;
}
.daba p{
color:yellow;
font-size:60px;
}
.contener
</style>
</head>
<body>
<nav class="navbar">
<div class="logo">
<h1><span>D</span>arrel.</h1>
</div>
<ul>
<li><a href="#">contact.us</a></li>
<li><a href="#my">isckon</a></li>
<li><a href="#">about</a></li>
<li><a href="#">home</a></a></li>
</ul>
</nav>
<div class="box">
<img src="/—Pngtree—man in shirt smiles and_13146348.png" alt="">
</div>
<div class="heading1">
<h1>hello i'm</h1>
<h2><span>D</span>ARREL</h2>
<button class="bts"><a href="">doenload cv</a></button>
<br>
<br>
<br>.<br>
<br>
<br>
<br>
<br>.<br>
<br>
<br>
<br>
<br>.<br>
<br>
<br>
<br>
<br>.<br>
<br>
<br>
<br>
<br>.<br>
<br>
<br>
<br>
<br>.<br>
<br>
<div class="expression">
<h1> <a name="my"></a>my expression</h1>
<div class="daba">
<h1>flipkard</h1>
<h3>2015-2017</h3>
<p>this is my first job of thish company and i am very happy </p>
</div>
<div class="daba">
<h1>flipkard</h1>
<h3>2015-2017</h3>
<p>this is my first job of thish company and i am very happy </p>
</div>
<div class="daba">
<h1>flipkard</h1>
<h3>2015-2017</h3>
<p>this is my first job of thish company and i am very happy </p>
</div>
<div class="contener">
</div>
<div>
</div>
</body>
</html>
.png)
Image download Source
0 Reviews