منوی بوت استرپ

سلام اگر درست متوجه شده باشم زمانی که در حالت موبایل رفت میخوای رنگ عوض بشه میتونی از کد زیر استفاده کنی

@media (max-width: 991px){}

با بازی با مقدار 991 میتونی هر زمان و هر چیزی رو تغییر بدی
تو آدرس زیر هم میتونی دقیق تر مطالعه کنی
https://getbootstrap.com/docs/4.4/layout/overview/

@omid.mardaneh
ببخشید میدونم مدیا باید بهش بدم ... ولی میخوام وقتی منوی collapse من در حالت موبایل رفت اون صفحه ای که برای لیست ایتم ها باز میشه رنگ و بگیره نه خود همبرگر منو رنگ بگیره.

خوب کد رو بزار بهت بگم دقیقا اما اگه به صورت استاندارد رفته باشی جلو به ul خودت background بدی تو مدیا اوکی میشه

<div class="container-fluid">
    <div class="nav-menu">
        <div class="row">
            <div class="col">
                <nav class="navbar  navbar-expand-md  navbar-light bg-white fixed-top">
                    <a href="index.php" class="navbar-brand ml-3">
                        <img class="img" src="images/1.png" alt="ideno" width="42" hight="42">
                    </a><!-- navbar-brand -->
                <div class="button">
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse">
                        <span class="navbar-toggler-icon"></span>
                    </button>
                </div>
                    <div class="collapse navbar-collapse  justify-content-start" id="navbarCollapse">
                        <ul class="navbar-nav">
                            <li class="nav-item">
                                <a href="" class="nav-link  active"> خانه</a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="nav-link">مقالات </a>
                            </li>
                            <li class="nav-item disabled">
                                <a href="" class="nav-link">پروژه </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="nav-link">تماس </a>
                            </li>
                        </ul><!-- navbar-nav -->
                    </div><!-- collapse navbar-collapse -->
                </nav><!-- navbar -->
            </div><!-- col -->
        </div><!-- row --> 
    </div><!-- nav-menu -->

.navbar{
    flex-direction: row-reverse;
    }

 .navbar-nav .nav-item .nav-link{
        /* padding-left:3rem; */
        padding-right:2.5rem;
        color: black;  
        font-size:1.2rem;
        font-weight:300;

}

.nav-menu{
    padding: 1rem;
    /* transition: all .3s ease; */
    background-color: #fff;
}

@media (max-width: 768){
    .navbar{
        background-color: gray;
    }

}

.navbar-brand {
    padding-top: 0rem;
    padding-bottom: 0px;
  }

@media (max-width : 768px){
    .button {
        padding-right:1rem;
    }

@media (min-width : 992px) {
    .navbar-expand-lg .navbar-nav .navbar-link{
        font-size: 14px;
        padding-right: 1rem;
        padding-left: 1rem;
    }
    .navbar-expand-lg .navbar-nav .navbar-link.active::after{
        content: "";
        border-bottom: 2px solid #cd99d4;
        left:1rem;
        right:1rem;
        bottom:5px;
        height:1px;
        position: absolute;
    }
}

@media (max-width:991px){
    .navbar-nav .nav-item{
     /*    text-align: right; */
        text-align: center;

    }
}

سلام، به ul.navbar-nav به صورت زیر:

@media (min-width: 991px) {
 ul.navbar-nav {
  background: #279aff;
 }