index dosyası:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body><div class="ana">
<div class="kafa">
<div class="baslik">AHMET ÖZTAŞ</div>
<div class="altbaslik">Bilişim Teknolojileri Öğretmeni</div>
</div>
<div class="menu"></div>
<div class="icerik"></div>
<div class="son"></div>
</div>
</body>
</html>
Stil dosyası:
body {
background: white;
}
p {
color: black;
}
h1 {
font-weight: bold;
}
.ana{background-color: brown;
width:800px; height: 1150px; margin:auto; padding: 25px;}
.kafa{background-color: cadetblue; background-image: url(images.jpg);
background-size:800px;
width:800px; height: 300px; border-radius: 10px;}
.menu{background-color: chartreuse; width: 200px; height: 500px;
float:left; margin-top: 10px;}
.icerik{background-color: chocolate; width:590px; height: 500px;
margin-left: 10px; float: left; margin-top: 10px; margin-bottom: 10px;}
.son{background-color: darkgrey; width: 800px; height: 300px;
clear: both;}
.baslik{position: relative; font-size: 30pt; color:#8CBCDC; top:80px;
background-color:aquamarine; opacity: 0.8}
.altbaslik{position:relative; font-size: 16pt; color:#ffffff; top:110px}
.menu1{background-color: deepskyblue; margin-bottom: 5px; color:blanchedalmond;}
.menu1:hover{background-color:darkgray; margin-bottom: 5px; color:blanchedalmond;}
