Egid Dikmen
Hectopat
Daha fazla
- Sistem Özellikleri
- Macbook Pro 16" M1 Pro Silver
- Cinsiyet
- Erkek
- Meslek
- Ağa/Paşa
Kod aşağıdaki gibidir. Üstte resim altında da başlık oluyor ancak ben solda resim sağda başlık olmasını yapmaya çalışıyorum.
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Ferhat DIKMEN</title>
<meta name="author" content="Ferhat DIKMEN">
<meta name="keywords" content="Ferhat , Dikmen , DIKMEN , Ferhat Dikmen , Portfolio , Portfoy">
<meta name="description" content="Ferhat Dikmen's personal portfolio website">
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859">
<meta http-equiv="content-language" content="tr">
<meta http-equiv="refresh" content="180">
<link rel="stylesheet" href="css/anasayfa.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div class="karsilama">
<img id="baslik_resmi" src="images/emo1.png" alt="Goz Kirpan Emoji">
<h1 id="baslik">Ferhat DIKMEN</h1>
</div>
<div class="navigate">
<div id="direk">
<div id="right">
<a class="sign-link" href="#">Anasayfa</a>
<div id="right-arrow"></div>
</div>
<div id="left">
<a class="sign-link" href="#" onclick="goBack()">Geri</a>
<div id="left-arrow"></div>
</div>
</div>
</div>
</body>
</html>
CSS:
body{
background-color: #FFF3EE;
}
.navigate{
border: 2px solid black;
height: 750px;
width: 750px;
margin-left:1000px;
margin-top: 50px;
padding: auto;
}
#baslik_resmi{
height:184px ;
width:157px ;
}
#baslik{
color: #494BD9;
}
*{
box-sizing: border-box;
}
.sign-link{
text-decoration: none;
color: white;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
#direk{
margin: auto;
border-radius: 1vw 1vw 0 0;
height: 80vh;
width: 5.5vw;
transform: translateY(160px);
min-width: 45px;
background-color: #30343f;
font-size: 1.5em;
@media (max-height: 400px){
transform: unset;
height: 400px;
}
}
#right{
height: 15.2vh;
transform: translate(-40px, 50px);
width: 24.5vw;
min-width: 200px;
background-color: crimson;
display: flex;
align-items: center;
justify-content: center;
color: white;
border-radius: 10px 50px 50px 10px;
border: 3px outset white;
}
#left{
@media (min-width: 768px){
transform: translate(-13vw, 80px) ;
}
perspective: 2000;
transform: translate(-100px, 80px) ;
width: 26.9vw;
min-width: 200px;
height: 14.2vh;
min-height: 90px;
background-color: teal;
display: flex;
align-items: center;
justify-content: center;
color: white;
border-radius: 50px 10px 10px 50px;
border: 3px outset white;
}
body, html{
height: 100%;
overflow: hidden;
}
Son düzenleyen: Moderatör:
