مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

کاربر سایت

laleh_456

عضویت از 1395/10/06

دادن استایل به زیر منو

  • جمعه 25 فروردین 1396
  • 12:22
تشکر میکنم

سلام دوستان من یه مگا منو طراحی کردم که کدهاش رو میذارم.با بوت استرپ.زمانیکه تعداد زیرمنوها زیاد باشه مرتب و تمیز نشون داده نمیشه چطور میتونم مرتبش کنم؟ممون میشم راهنمایی بفرمایید.

کد css:

.nav-tabs {
    display: inline-block;
    border-bottom: none;
    padding-top: 15px;
    font-weight: bold;
}

    .nav-tabs > li > a,
    .nav-tabs > li > a:hover,
    .nav-tabs > li > a:focus,
    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        border: none;
        border-radius: 0;
    }


.mega-dropdown {
    position: static !important;
}

.mega-dropdown-menu {
    padding: 10px 15px 15px;
    text-align: center;
    width: 100%;
}

کد html:

<div class="navbar navbar-default">
    <div class="directionrtl">
        <div class="container">
            
                <ul class="nav navbar-nav">
                    <li class="dropdown active">
                        @Html.ActionLink("خانه", "Index", "Home")
                    </li>
                    <li class="dropdown mega-dropdown ">
                        <a href="#" class="dropdown-toggle " data-toggle="dropdown" data-hover="dropdown" data-delay="0" data-close-others="false">
                            غذای اصلی<i class="fa fa-angle-down"></i>
                        </a>
                        <div class="dropdown-menu mega-dropdown-menu">
                            <ul class="list-inline">
                                <li>@Html.ActionLink("خورشت ها", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف دوشی زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف کج زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1004) }, null)</li>
                                <li>@Html.ActionLink("کیف شب زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(4) }, null)</li>
                                <li>@Html.ActionLink("کیف پول زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1002) }, null)</li>
                                <li>@Html.ActionLink("خورشت ها", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف دوشی زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف کج زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1004) }, null)</li>
                                <li>@Html.ActionLink("کیف شب زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(4) }, null)</li>
                                <li>@Html.ActionLink("کیف پول زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1002) }, null)</li>
                                <li>@Html.ActionLink("خورشت ها", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف دوشی زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف کج زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1004) }, null)</li>
                                <li>@Html.ActionLink("کیف شب زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(4) }, null)</li>
                                <li>@Html.ActionLink("کیف پول زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1002) }, null)</li>
                                <li>@Html.ActionLink("خورشت ها", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف دوشی زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1003) }, null)</li>
                                <li>@Html.ActionLink("کیف کج زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1004) }, null)</li>
                                <li>@Html.ActionLink("کیف شب زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(4) }, null)</li>
                                <li>@Html.ActionLink("کیف پول زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(1002) }, null)</li>
                                <li>@Html.ActionLink("کیف شب زنانه", "Product", "Home", new { GroupId = Convert.ToInt32(4) }, null)</li>
                            </ul>
                        </div>


                    </li>


                    
                   

                </ul>
            
        </div>
    </div>
</div>

پاسخ های این پرسش

تعداد پاسخ ها : 1 پاسخ
کاربر سایت

laleh_456

عضویت از 1395/10/06

  • جمعه 25 فروردین 1396
  • 12:24

اینم از اسکرین شات زیر منو که بهم ریخته هستن:

کاربرانی که از این پست تشکر کرده اند

هیچ کاربری تا کنون از این پست تشکر نکرده است

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید

با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)