رفتن به مطلب

یه سوال تخصصی در رابطه با css منو


پست های پیشنهاد شده

سلام

یه سوال داشتم راهنمایی بفرمایید لطفا

با این کد css


nav ul li:nth-child(1){
background:#F90;
}

من منوی سایتم رو فقط اولین منو رو نارنجی کردم العان یه مشکلی که دارم اینه که میخوام فقط منوی اول فقط سر منو نارنجی شه یعنی تحصیل در راهبرد نه اینکه سر منوی های اول نارنجی شه شکل رو مشاهده کنید متوجه میشید

12.png

13.png

اینم کد css نویگیشنمه


/* =NAVIGATION
----------------------------------------------- */
nav li > ul,
nav li > ol {
margin:0;
list-style: none;

}
.main-navigation {
}
.main-navigation li {
float:right;
}
.main-navigation ul li a {
font-size: 15px;
text-align:center;
color: #fff;
background-color:#89D2FD;
-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-ms-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
transition: background 0.2s linear;
}
.main-navigation li.default-menu,
li.default-menu {
}
.main-navigation a {
width:189px;
float: right;
line-height:70px

}
.main-navigation a:hover,
.main-navigation ul li.current-menu-item a,
.main-navigation ul li.current_page_ancestor a,
.main-navigation ul li.current-menu-ancestor a,
.main-navigation ul li.current_page_item a,
.main-navigation ul li:hover > a {

background:#248FCA;
border-left:0.1em solid #B8E4FE;
width:188px;
}

nav {
margin:0 auto;
text-align: center;
}
nav ul ul {
display: none;
height:30px;
line-height:30px;
}
nav ul li:hover > ul {
display: block;
}
nav ul {

list-style: none;
position: relative;
display: inline-table;
height:70px;
line-height:70px;
}
nav ul:after {
}
nav ul li {
float: right;
background: url('images/ImageAll-2.png') no-repeat;
background-position: 94.159% 58.774%;
background-color:#89D2FD;
}
nav ul li:hover {
background:#248FCA;
border-left:0.1em solid #B8E4FE;
width:188px;
-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-ms-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
transition: background 0.2s linear;
}
nav ul li:hover a {
color: #fff;
}

nav ul li a {
display: block;
text-decoration: none;
font-size: 16px;
text-align:center;
color: #fff;
width:189px;

}


nav ul ul {
width:188px;
position: absolute;
border-top: 1px solid #BFE7FE;

}
nav ul ul li{
float: none;
background:#248FCA;
position: relative;
z-index: 999;
}
nav ul ul li a {
font-size: 14px;
color: #fff;
-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-ms-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
transition: background 0.2s linear;
}
nav ul ul li a:hover
{
background: #78CCFD;
width:189px;
}

nav ul ul ul {
position: absolute; left: 100%; top:0;
}
.current-cat , .current_page_item , .current-cat-parent{
background:#248FCA;
border-left:0.1em solid #B8E4FE;
width:188px;
}
ul.children li.current-cat {
background:#78CCFD !important;
}
ul li.current-cat ,li li.current_page_item ,li li.current-cat-parent{
background:#78CCFD;
width:188px;
}
nav ul li:nth-child(1){
background:#F90;
}

nav ul,
ol {
list-style: none;
margin-right:0;
}

ویرایش شده توسط Blood
لینک به ارسال

سلام

در این قسمت رنگ پشت زمینه را حذف کنید.


nav ul ul li a:hover
{
background: #78CCFD;
width:189px;
}

لینک به ارسال

سلام

در این قسمت رنگ پشت زمینه را حذف کنید.


nav ul ul li a:hover
{
background: #78CCFD;
width:189px;
}

چرا باید این کار رو انجام بدم؟ بک گراند برداشته میشه این نیست

بفرمایید:


nav > ul > li:nth-child(1){
background:#F90;
}

این هم عمل نکرد

لینک به ارسال

فکر میکنم متوجه درخواستم نشدید

من فقط میخوام منوی تحصیل در راهبرد رنگش فرق کنه همین نه زیر منوی تحصیل در راهبرد یا تمام زیر منو های اول من

لینک به ارسال

چرا باید این کار رو انجام بدم؟ بک گراند برداشته میشه این نیست

1- دقیقا همونه چون خاصیت hover شما رنگ 78CCFD گرفته که میخواهید نباشه پس درنتیجه باید حذف کنید یا خالی بذارید.

2- CTRL+F5 فراموش نشه.

لینک به ارسال

سلام ، به همون li خاص یه استایل جداگانه بدین تا زیر مجموعه هاش رو در بر نگیره (مثل selected)

اگه کد هاتون PHP هست بگین تا توضیحات در اون مورد رو هم بدیم.

لینک به ارسال

لطفا کد های html منو را هم قرار بدید

این کد html


div class="styleHeder-large-Left"><?php get_search_form(); ?></div></div>
<nav><?php if ( has_nav_menu( 'primary' ) ) {wp_nav_menu( array( 'theme_location' => 'primary' ) );}else {wp_page_menu();}?>
</nav></div>

1- دقیقا همونه چون خاصیت hover شما رنگ 78CCFD گرفته که میخواهید نباشه پس درنتیجه باید حذف کنید یا خالی بذارید.

2- CTRL+F5 فراموش نشه.

اینی که شما میگید خاصیت hover رو غیر فعال میکنه نه اینکه رنگ نارنجی که میخوام نیوفته تو تمام منوی های اول این کار رو انجام نمیده تست کردم نشد

سلام ، به همون li خاص یه استایل جداگانه بدین تا زیر مجموعه هاش رو در بر نگیره (مثل selected)

اگه کد هاتون PHP هست بگین تا توضیحات در اون مورد رو هم بدیم.

منظورتون رو لطفا با مثال بزنید

لینک به ارسال

این کد html


div class="styleHeder-large-Left"><?php get_search_form(); ?></div></div>
<nav><?php if ( has_nav_menu( 'primary' ) ) {wp_nav_menu( array( 'theme_location' => 'primary' ) );}else {wp_page_menu();}?>
</nav></div>

البته این کد html منو نیست بلکه تابع فراخوانی منو وردپرس هست. به هر حال با کد زیر کارتون باید راه بیوفته


nav ul.menu > li:nth-child(1) {
background:#F90;
}

لینک به ارسال

این کد هیچ عملی رو انجام نمیده ؟

البته این کد html منو نیست بلکه تابع فراخوانی منو وردپرس هست. به هر حال با کد زیر کارتون باید راه بیوفته


nav ul.menu > li:nth-child(1) {
background:#F90;
}

مشاهده کنید لطفا منو سایت رو

http://www.rahboord.com/

ویرایش شده توسط Blood
لینک به ارسال

با سلام


.current-cat , .current_page_item , .current-cat-parent{
background: black important!;
border-left:0.1em solid #B8E4FE;
width:188px;}

در کد بالا .current_page_item حذف کن و به این در خط جدید بکگراند رو بده


.current_page_item{background:#FF6600 !important;}

موفق باشید

لینک به ارسال

این کد هیچ عملی رو انجام نمیده ؟

مشاهده کنید لطفا منو سایت رو

http://www.rahboord.com/

ببخشید به خاطر اینکه ساختار دقیق کد های html منو رو نمی دونستم اشتباه شد. این را امتحان کنید.


nav .menu > ul > li:nth-child(1) {
background: none repeat scroll 0 0 #e04f5f;
}

لینک به ارسال

ببخشید به خاطر اینکه ساختار دقیق کد های html منو رو نمی دونستم اشتباه شد. این را امتحان کنید.


nav .menu > ul > li:nth-child(1) {
background: none repeat scroll 0 0 #e04f5f;
}

بله درست شد دوست عزیز ممنون از راهنمایی شما امید وارم بتونم جبران کنم

لطفا به سایت مجتمع فنی راهبرد سری بزنید و اگر پیشنهادی دارید به ما بگید تا از تجربیات شما استفاده کنیم باز ممنون از شما

لینک به ارسال
  • 1 سال بعد...
در 23 ساعت قبل، farhang_abasi گفته است :

سلام خسته نباشید کسی هم میتونه به من کمک کنه میخوام تو هیدر سایتم تغییرات ایجاد کنم ولی زیاد تخصص ندارم اینم ادرس سایتمه SainKala.com

سلام

لطفا ی تاپیک جدید ایجاد کنید و سوالتون رو اونجا بپرسید

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...