رفتن به مطلب

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


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

من یاد نگرفتم برای تکرار نشدن این عکس باید چیکار کنم. میشه بیشتر راهنماییم کنید؟ منظورم عکس منو هست

لینک به ارسال

در کجا تکرار میشه؟ سایت خودتون؟ اگر سوال جدید هست در تاپیک جدید مطرح کنید

لینک به ارسال

نه سوال جدید نیست

در مورد همون منو با عکس هستش

عکس که داخل منو هست چند بار تکرار می شه .

لینک به ارسال

در استایل باید بهش no-repeat بدید. البته گر بصورت بکگراند هست

لینک به ارسال

پوسته دو ستونه ساده هست

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

اسلایدرش رو چجوری میشه کپی کنیم؟

لینک به ارسال
اسلایدرش رو چجوری میشه کپی کنیم؟

از کجا کپی کنید؟

همون پوسته؟

لینک به ارسال

در استایل باید بهش no-repeat بدید. البته گر بصورت بکگراند هست

یعنی در کدها به کجا اضافه کنم؟

#site-navigation .page-item- 35 {

background-image:url('http://www.bonap.ir/up/Icon/Kebab.jpg');

padding-right:68px;

padding-left:18px;

width: 100px;

border-radius: 2;

color: #444;

height:70

}

لینک به ارسال

لطفا کد را بدون تغییر به استایلتون اضافه کنید


#site-navigation .page-item- 35 {
background-image:url('http://www.bonap.ir/up/Icon/Kebab.jpg');
background-repeat:no-repeat;
background-position:right center;
padding-right:68px;
padding-left:18px;
width: 100px;
border-radius: 2px;
color: #444;
height:70px;

}

لینک به ارسال

#site-navigation .page-item-35 {
background-image:url('http://www.bonap.ir/up/Icon/Kebab.jpg');
background-repeat:no-repeat;
background-position:right center;
padding-right:68px;
padding-left:18px;
width: 100px;
border-radius: 2px;
color: #444;
height:70px;
}

لینک به ارسال
  • 4 هفته بعد...

خوب این کدها برای قالبی که جاری بود تنظیم شدن نباید در همه قالب ها نمایش داده بشند

در قالب اخیر دوباره باید همه چی بسته به استایل و وضعیت سایت باز نویسی شه

من درست یادم نمی آد کارتون چی ها بود لطف کنید آیتم به آیتم و با قید آدرس سایت دوباره بنویسید

لینک به ارسال

یک دنیا ممنون

آدرس سایتم : www.bonap.ir

سوالم : می خوام منوی کشویی که باز می شه کنار هر آیتم منو یک عکس کوچیک مثل آیکون هم نمایش داده بشه

مثلا منوی ساندویچ کنارش عکسش و نشون بدم یا روی منوی پیتزا که میرم عکس پیتزا نشون داده بشه .

کدهای استایل هم:

http://www.pasteall.org/44965/css

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

این قالب بخاطر اینکه به لایه ها با css ترام داده در واقع از background-image لایه استفاده کرده به نظرم بهترین کار اینه


nav ul .page_item {
position:relative;
line-height:20px;
}
nav ul .page_item:after {
display:none;
position:absolute;
background-attachment:scroll;
background-color:#eee;
background-position:center center;
background-repeat:no-repeat;
background-size:96px 96px;
width:100px;
height:100px;
border:1px #aaa solid;
top:-40px;
}
nav ul .page_item:hover:after {
display:inline-block;
}

.page-item-69:after {
background-image:url('IMAGE-69.PNG');
}

توجه کنید در کد بالا


line-height:20px;

اندازه ارتفاع منو است که می تونید به دلخواه کم یا زیادش کنید ولی هر عددی رسیدید باید از ارتفاع حالت after که در این نمونه 100px فرض شده کم کنید و باقی مانده ارتفاع after را (80) تقسیم بر دو کنید و در کد در بخش


top:-40px;

به جای 40 بگذارید


.page-item-69:after {
background-image:url('IMAGE-69.PNG');
}

با استفاده از آی دی صفحاتی که می خواهید عکسشون دیده بشه و گذاشتن جای عدد 69 و قرار دادن نشانی تصویر به جای IMAGE-69.PNG تصاویر را معرفی کنید

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

اما اگر تصویری دیده نشد راهش برداشتن ترام رنگی پس زمینه منو و قرار دادن کد تصویر بک گرانده که با ویرایش این قسمت از کدهای استایل شدنیه

/* =Menu

-------------------------------------------------------------- */

#access {

background: #e31e25; /* Show a solid color for older browsers */

background: -moz-linear-gradient(#842624, #e31e25);

background: -o-linear-gradient(#842624, #e31e25);

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#842624), to(#e31e25)); /* older webkit syntax */

background: -webkit-linear-gradient(#842624, #e31e25);

-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;

-moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;

box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;

clear: both;

display: block;

float: left;

margin: 0 auto 2px;

width: 100%;

border: 6px solid #ececec;

margin:0px 0px 0px 0px;

}

#access ul {

font-size: 13px;

list-style: none;

margin: 0 0 0 -0.8125em;

padding-left: 0;

font-weight:bold;

line-height: 5.246153846;

}

#access li {

float: left;

position: relative;

}

#access a {

color: #eee;

display: block;

line-height: 3.333em;

padding: 0 1.2125em;

text-decoration: none;

}

#access ul ul {

-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);

-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);

box-shadow: 0 3px 3px rgba(0,0,0,0.2);

display: none;

float: left;

margin: 0;

position: absolute;

top: 3.333em;

left: 0;

width: 188px;

z-index: 99999;

}

#access ul ul ul {

left: 100%;

top: 0;

}

#access ul ul a {

background: #f9f9f9;

border-bottom: 1px dotted #ddd;

color: #444;

font-size: 13px;

font-weight: normal;

height: auto;

line-height: 1.4em;

padding: 10px 10px;

width: 168px;

}

#access li:hover > a,

#access ul ul :hover > a,

#access a:focus {

background: #efefef;

font-weight: bold;

}

#access li:hover > a,

#access a:focus {

background: #d81e21; /* Show a solid color for older browsers */

background: -moz-linear-gradient(#f9f9f9, #e5e5e5);

background: -o-linear-gradient(#f9f9f9, #e5e5e5);

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */

background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);

color: #912a23;

}

#access ul li:hover > ul {

display: block;

}

#access .current-menu-item > a,

#access .current-menu-ancestor > a,

#access .current_page_item > a,

#access .current_page_ancestor > a {

font-weight: bold;

background: #d81e21; /* Show a solid color for older browsers */

background: -moz-linear-gradient(#f9f9f9, #e5e5e5);

background: -o-linear-gradient(#f9f9f9, #e5e5e5);

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */

background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);

color: #912a23;

}

لینک به ارسال

باید صبر کنید تا قالب تست بشه و کدهای اورفلوش را چک کنم

فقط پاسخی که می گذارم را اگر ظرف 24 ساعت تست نکنید دیگه پاسخ نمی دم من هر بار مجبور کل صفحات گذشته رو بخونم تا یادم بیاد شما مشکلتون چی بود

لینک به ارسال

#access .children li.page-item-25>a {
height:auto;
display:block;
background-repeat:no-repeat;
background-position:right center;
background-size:100px 100px;
}
#access .children li.page-item-25:hover>a {
padding-right:100px;
height:100px;
background-image:url('image-25.gif');
}

لینک به ارسال

فقط یه ایراد کوچیک دارم . ببینید وقتی داخل منو هستید گزینه ساندویچ چه طور نشون داده می شه...

لینک به ارسال

#access .children li.page-item-25>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-25:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Sandwich.gif');

}

#access .children li.page-item-27>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-27:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Pizza.gif');

}

#access .children li.page-item-28>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-28:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Fried Chicken Normal.gif');

}

#access .children li.page-item-29>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-29:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Burger.gif');

}

#access .children li.page-item-30>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-30:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Fish&Chips.gif');

}

#access .children li.page-item-35>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-35:hover>a {

width:118px;width:118px;

padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Kebab.gif');

}

#access .children li.page-item-36>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-36:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/Coke.gif');

}

#access .children li.page-item-37>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-37:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/French Friz.gif');

}

#access .children li.page-item-38>a {

height:auto;

display:block;

background-repeat:no-repeat;

background-position:right center;

background-size:50px 50px;

}

#access .children li.page-item-38:hover>a {

width:118px;padding-right:60px;

height:50px;

background-image:url('http://www.bonap.ir/up/Icon/salad 1.gif');

}

لینک به ارسال

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

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

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

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

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

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

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

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

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