Etiketler

CSS üstte sabit duran menü yapımı

Sitenin en üstünde sabir şekilde duran menüler ile birçok site ve blog’da karşılaşıyoruz. Benzer bir menüyü sizde sitenize eklemek istiyorsanız basitçe özel hazırlanan bu örneği de kullanabilirsiniz.

 HTML Kodu:

<html>
<head>
    <meta charset="utf-8">
    <title>Yusuf Akdin</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div class="ust">
        Üst taraftaki sabit menü
    </div>
    <div class="orta">
        Site İçeriği
    </div>
</body>
</html>

CSS Kodu:

html,body{
    margin: 0;
    padding: 0;
}
 
body{
    font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
    font-size: 100%;
    background-color: #CCCCCC;
    width: 100%;
    text-align: center;
}
 
.ust{
    position: fixed;
    width: 100%;
    height: 50px;
    background-color: #FFF;
    border-bottom: 1px solid #111;
    z-index: 2;
}
 
.orta{
    position: absolute;
    top: 350px;
    width: 100%;
    height: 800px;
    z-index: 1;
}
Etiketler:

Yorumlar

Yorum Gönder

Popüler Yayınlar