Responsive Ad
Responsive Ad
Featured Games
Cookie Consent

We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.

404Something Wrong!

The page you've requested can't be found. Why don't you browse around?

Take me back
Featured Apps

APMODY

Mauris lacus dolor, ultricies vel sodales ac, egestas vel eros.

webpaylaşım

Situs Coder Blogging yang menyediakan tutorial seputar Blog, Coding, dan Editing. Belajar Fundamental Programming disinlah tempatnya!

Code Pelajar

Fundamental Programming.

See All

resimli üst menü kodu

 Resimli sol tarafta en üstte sabit kalan menü kodu

önizleme                               

Aşağıdaki kodları tema>yerleşim dedikten sonra add gadget seğeneği(gadged ekle) diyoruz gadget'lerden html ve kaydet.
<title>resimli üst menü örneği</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="KODLANACAKLAR/FixedNavigationTutorial2/css/style.css" type="text/css" charset="utf-8" />          <style type="text/css">
        body{
            font-family:Arial;
            height:2000px;
        }
        .header
        {
            width:600px;
            height:56px;
            position:absolute;
            top:50%;
            left:10px;
        }
        a.back{
            width:256px;
            height:73px;
            position:absolute;
            bottom:15px;
            right:15px;
        }
        a.dry{
            position:absolute;
            bottom:15px;
            left:15px;
            text-align:left;
            font-size:12px;
            color:#ccc;
            text-transform:uppercase;
            text-decoration:none;
        }
  ul#navigation {
    position: fixed;
    margin: 0px;
    padding: 0px;
    top: 0px;
    right: 10px;
    list-style: none;
    z-index:999999;
    width:721px;
}
ul#navigation li {
    width: 103px;
    display:inline;
    float:left;    
}
ul#navigation li a {
    display: block;
    float:left;
    margin-top: -2px;
    width: 100px;
    height: 25px;
    background-color:#E7F2F9;
    background-repeat:no-repeat;
    background-position:50% 10px;
    border:1px solid #BDDCEF;
    -moz-border-radius:0px 0px 10px 10px;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -khtml-border-bottom-right-radius: 10px;
    -khtml-border-bottom-left-radius: 10px;
    text-decoration:none;
    text-align:center;
    padding-top:80px;
    opacity: 0.7;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);  
}
ul#navigation li a:hover{
     background-color:#CAE3F2;
}
ul#navigation li a span{
    letter-spacing:2px;
    font-size:11px;
    color:#60ACD8;
    text-shadow: 0 -1px 1px #fff;      
}
ul#navigation .ana_sayfa a{
    background-image: url(http://img.webme.com/pic/f/frmbestlive/ana_sayfa01.png);
}
ul#navigation .hakkimda a      {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/hakkimda01.png);
}
ul#navigation .arama a      {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/arama01.png);
}
ul#navigation .galeri a      {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/galeri01.png);
}
ul#navigation .destek a   {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/destek01.png);
}
ul#navigation .istatistikler a     {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/istatistikler01.png);
}
ul#navigation .iletisim a    {
    background-image: url(http://img.webme.com/pic/f/frmbestlive/iletisim01.png);
}
    </style>
<div class="header">&nbsp;</div>
<ul id="navigation">
    <li class="ana_sayfa"><a href=""><span>Ana Sayfa</span></a></li>
    <li class="hakkimda"><a href=""><span>Hakkımda</span></a></li>
    <li class="arama"><a href=""><span>Arama</span></a></li>
    <li class="galeri"><a href=""><span>Galeri</span></a></li>
    <li class="destek"><a href=""><span>Online Destek</span></a></li>
    <li class="istatistikler"><a href=""><span>İstatistikler</span></a></li>
    <li class="iletisim"><a href=""><span>İletişim</span></a></li>
</ul>
</meta>