PDA

View Full Version : سوال: ایجاد رنگ های مختلف در منو ها (کتگوری)



number13
پنج شنبه 05 شهریور 1394, 03:16 صبح
سلام.
من میخواستم رنگ های مختلف توی کتگوری زیر ایجاد کنم.
http://s6.uplod.ir/i/00667/aooxhgfh8c5d.png
مثلا بک گراند نوشته ی اول آبی ، بک گراند نوشته ی دوم قرمز ، بک گراند نوشته ی سوم سبز و ...
خب توی دستورات css چی باید اضافه کنم؟

anvar
پنج شنبه 05 شهریور 1394, 14:43 عصر
فرض می کنیم شما دارای یک UL هستید و هر کدام از ایتم های بالا LI هستند (می توان ظرف والدی در نظر گرفت که دارای چندین عنصر فرزند است - مثلا یک div والد و 10 عدد div فرزند)

یک کلاس به اختیار خودتون به ظرف والد بدهید (در اینجا UL یا Div والد) مثلا myparent

حالا می توانیم با استفاده از دستور nth-child(4n) به چهارمین عنصر فرزند این عنصر والد (UL یا DIV با کلاس myparent) دسترسی داشته باشیم و رنگ زمینه آنرا تغییر بدهیم

مثلا رنگ زمینه چهارمین فرزند باید قرمز باشد :
.myparent:nth-child(4n)
{
background-color:#f00;
}

با عوض کردن 4n می شه به سایر فرزندها خاصیت مورد نظر رو داد

number13
پنج شنبه 05 شهریور 1394, 15:29 عصر
سلام مرسی از پاسخ گویی تون. من نتونستم تغییر بدم.
میشه شما یه تغییراتی رو توی این کد ها داشته باشید؟
(ببخشید زحمت میدم بهتون)
لینک دانلود:
http://uplod.ir/dboit6b4r75v/moshkel.zip.htm

مرسی.
مثلا میخوام اینطوری بشه:
آبی ، خاکستری ، نارنجی ،آبی ، خاکستری ، نارنجی و ......
بازم ببخشید.

anvar
پنج شنبه 05 شهریور 1394, 21:00 عصر
کدهای زیر رو به فایل css اضافه کن

.list-inline li:nth-child(1) {
background-color: #3399FF;
}

.list-inline li:nth-child(2) {
background-color: #F1F1F1;
}

.list-inline li:nth-child(3) {
background-color: #FF9966;
}

.list-inline li:nth-child(4) {
background-color: #3399FF;
}

.list-inline li:nth-child(5) {
background-color: #F1F1F1;
}

.list-inline li:nth-child(6) {
background-color: #FF9966;
}