walter wick
Kilopat
Daha fazla
- Cinsiyet
- Erkek
Arka plana fotoğraf koymak istiyorum ama olmuyor. Bir bakar mısınız?
@Ecmel
HTML:
<!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 card</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="reset.css">
</head>
<body>
<div class="profilecard">
<figure class="image.png">
<img src="download.jpg" alt="..."
</figure>
<div class="image__desc"></div>
</div>
<h1>ömer </h1>
<div>beginer developer</div>
<div style="display: flex;align-items:center;gap: 10px;;">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-map-pin" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<circle cx="12" cy="11" r="3"></circle>
<path d="M17.657 16.657l-4.243 4.243a2 2 0 0 1 -2.827 0l-4.244 -4.243a8 8 0 1 1 11.314 0z"></path>
</svg>
<span>türkiye </span>
</div>
<div class="profile-card__info">
<div>
<div>850</div>
<div>takipci</div>
</div>
<div>
<div>50</div>
<div>tercihler</div>
</div>
<div>
<div>105</div>
<div>iş</div>
</div>
</div>
<div class="profile-card__social">
<a href="#"class="facebook" >
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-facebook" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M7 10v4h3v7h4v-7h3l1 -4h-4v-2a1 1 0 0 1 1 -1h3v-4h-3a5 5 0 0 0 -5 5v2h-3"></path>
</svg>
</a>
<a href="#"class="instgram" >
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<rect x="4" y="4" width="16" height="16" rx="4"></rect>
<circle cx="12" cy="12" r="3"></circle>
<line x1="16.5" y1="7.5" x2="16.5" y2="7.501"></line>
</svg>
</a>
</div>
<div class="profile-card__actions">
<button class="blue">send mesaage</button>
<button class="orange">takip et </button>
</div>
</div>
</body>
</html>
CSS:
@import url('https://fonts.googleapis.com/css2? family= Nunito:wght@300;400;500;600;700 & display=swap');
body {
font: 18px "nunito" , sans-serif ;
color: black;
min-height:100vh ;
padding: 2rem;
display :flex ;
justify-content: center;
align-items: center;
& ::before {
content: '';
position: fixed;
inset: 0;
z-index:-1 ;
pointer-events: none ;
background: <img src="download.jpg" no-repeat center ;
background-size: cover;
}
}
@keyframes
{
}@Ecmel