گزینه ها
arash noroozi

یک مشکل منو در css

CSS

توسط arash noroozi در 3 سال پیش
093833 سال پیش
با سلام به همه دوستان
من یک منو ساخته ام و به آن یک پس زمینه آبی دادم زمانی که صفحه مرورگر را بزرگ می کنم هنگامی که اسکرول صفحه مشخص می شود و آن را به سمت چپ می کشم کناره های منو دیگر رنگ سفید خود صفحه را نشان می دهد.لطفا کمکم کن

کد
nav {

    text-align:center;
    
    
    
    }


li {

    margin-left:50px;

    }
    
    
/*nav li  {
    
        display:inline;
    
        
        }*/

        
nav{ width: 100%; height: 70px; background: url('../image/header-bg.jpg') ; margin: 0; padding: 0 30px 5px; position: relative;}

nav ul{display: block; width: auto; background: url('../image/header-bg.jpg') ; }

nav ul li{display: inline-block; position: relative;}

nav ul li>a{display: inline-block; font: 15px/27px tahoma; color: #fff; padding: 2px 15px 6px 8px;}

nav ul li>a:hover{color: #FEEF00;}

.menu{ display: hidden; width: 40px; height: 40px; margin-left:550px; background: url("../image/menu.png") ;}
آخرین ویرایش: 20-08-2014 ساعت 15:06، توسط Daniel
پاسخ
کد
<nav>
    <a href="#" id class="menu"></a>

    <ul id="TopMenu">

    
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">One</a></li>
    <li><a href="#">Two</a></li>
    <li><a href="#">Three</a></li>
    <li><a href="#">Four</a></li>
    </ul>
    </nav>

کد
div.titr a {
                color:#F2EBEB;
                }

        
nav {

    text-align:center;
    /*font-size:20px;*/
    /*padding-top:20px;*/
    
    
    }


li {

    margin-left:50px;

    }

        
nav{ width: 100%; height: 70px; background: url('../image/header-bg.jpg') ; margin: 0; padding: 0 30px 5px; position: relative;}

nav ul{display: block; width: auto; background: url('../image/header-bg.jpg') ; }

nav ul li{display: inline-block; position: relative;}

nav ul li>a{display: inline-block; font: 15px/27px tahoma; color: #fff; padding: 2px 15px 6px 8px;}

nav ul li>a:hover{color: #FEEF00;}

.menu{ display: hidden; width: 40px; height: 40px; margin-left:550px; background: url("../image/menu.png") ;}



@media only screen and (max-width : 970px) {


  .menu{display:inline-block;}

   .topMenu nav{position: relative; z-index: 100000; padding-top: 9px;}

   nav ul {display: none; position: absolute; padding:-11px 0; z-index: 100000; border: 3px solid #444; right: -25px; top: -1px; width: 150px; border-radius: 14px 0 14px 4px;}

   nav li { text-align: center; width: 120px; padding:5px; margin: 0;}

   nav:hover ul , nav:active ul { display: block;}

}
آخرین ویرایش: 20-08-2014 ساعت 15:07، توسط Daniel
پاسخ
0
Daniel در
دوست عزیز
کدها رو تو بلاک مخصوص کد قرار بده
کل منوت رنگش سفیده من هیچ رنگ آبی توش ندیدم
دقیقا میخوای منوت چطور باشه؟
پاسخ