hello friends....
TAKE THE FIRST STEP TO KNOWLEDGE FRIENDS BECAUSE KNOWLEDGE IS FREE.
HTML CODE
*******************
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>DESIGN VIEW</title>
<link rel="stylesheet" type="text/css" href="shape2.css">
</head>
<body>
<section id="main">
<div class="flex-container">
<div id="img-div">
<img src="pic1.jpg" id="image" alt="">
</div>
<h1 id="title">DHRUV PATEL</h1>
<p id="info">dnp developer</p>
</div>
</section>
</body>
</html>
---------- *** ----------
CSS CODE
***************
body{
margin: 0;
font-family: impact;
}
.flex-container{
height: 420px;
background: repeating-linear-gradient(120deg, white 0px, white 450px,
hsl(280,46%, 42%) 250px,
hsl(283,46%, 42%)
);
border-left: white;
}
#img-div{
height: 300px;
width: 300px;
border-radius: 50%;
border: 15px solid white;
top: 10%;
margin-left: 200px;
background: white;
text-align: center;
}
#image{
border-radius: 50%;
max-width:300px;
margin-top: 0px;
margin-left: 10px;
}
#title{
font-size: 90px;
color: whitesmoke;
font-family: impact;
font-weight: 100;
margin-left: 610px;
margin-top: -195px;
position: relative;
letter-spacing: 3px;
}
#info{
font-size: 20px;
font-weight: bold;
margin: auto;
margin-left: 619px;
margin-top: -40px;
text-transform: uppercase;
color: white;
letter-spacing: 5px;
}
----------***----------
OUTPUT
============
------------------------------------------------------------------------------------------------------------------------
>> IF YOU LIKE THIS BLOG, PLEASE SHARE AND SUBSCRIBE. ALSO COMMENT FOR THIS BLOG.
>> IF YOU HAVE ANY QUESTIONS PLEASE ASK IN COMMENT.
>> IF YOU WANT TO LEARN C PROGRAM WITH OUTPUT, SO VISIT THIS BLOG
https://dnpdeveloper.blogspot.com/
>> MY INSTAGRAM ID : dnp176
yes i like
ReplyDelete