mohammadtashi
12-11-2014, 10:30 AM
باسلام و عرض احترام
من طبق ی آموزش ویدئویی ی قالب ساده ساختم
ک یه موقعیت برای منو بالای اسلاید شو قراردادم
تا اینجا همه چی درست
اما یجای آموزش میاد کد سی اس اس مربوط به منو (سایز و رنگ تعریف شده بود)رو پاک میکنه و کد زیرو میذاره
با این کار سایت بیشتر بهم ریخت و اون موقعیت به اندازه گزینه های منو که زیر هم میاد باز شد
کد اولیه برای اون موقعیت اینو گذاشتم
#topmenu{
width:800px;
height:40px;
background-color:#000;
border-radius:10px;}
کدی که توی آموزش بود اول گرفت کد بالا رو پاک کرد بعد کد زیر رو پیست کرد
#menu1 {
direction:rtl;
overflow: visible;
color: #000;
position: relative;
z-index: 999;
}
#menu2 {}
#menu {
min-height: 40px;
width:800px;
background-color: #0784e4;
background-image: -moz-linear-gradient(top, #0784e4, #0750e4);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0784e4), to(#0750e4));
background-image: -webkit-linear-gradient(top, #0784e4, #0750e4);
background-image: -o-linear-gradient(top, #0784e4, #0750e4);
background-image: linear-gradient(to bottom, #0784e4, #0750e4);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#F90', endColorstr='#FC0', GradientType=0);
border: none;
-webkit-border-radius: 8px;
-moz-border-radius: 8px; border-radius: 8px;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
*zoom: 1;
}
#menu ul {
margin:0;
padding:0;
}
#menu ul li {
list-style:none;
display:inline-block;
position:relative;
padding:0;
margin:0;
height:40px;
border-left:1px solid #b5c5e5;
font-family:pars,Arial, Helvetica, sans-serif;
}
#menu ul li a {
display:block;
padding:0 15px;
margin:0;
line-height:35px;
text-decoration:none;
font-size:15px;
color:#000;
}
#menu .menu li a {
color: #000;
text-decoration: none;
text-shadow: 0 1px 0 #ffffff;
}
#menu .menu li a:hover {
background-color: transparent;
color: #CE205A;
text-decoration: none;
background-color: #e5e5e5;
-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}
#menu .menu .active a,#menu .nav .active a:hover {
color: #CE205A;
text-decoration: none;
background-color: #e5e5e5;
-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}
#menu ul li a span.menutitle {
display:block;
}
#menu ul li a span.menudesc {
float:right;
clear:both;
font-size:11px;
line-height:12px;
margin:-20px 0 0 0;
font-family:pars,Arial, Helvetica, sans-serif
}
/* submenu */
#menu ul li ul {
position:absolute;
width:170px;
right:-999em;
margin:0;
padding:5px;
background-color: #b5c5e5;
border: 1px solid #dedede;
*border-right-width: 2px;
*border-bottom-width: 2px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
#menu ul li a:hover {
text-decoration:overline;
text-shadow:0px 1px 1px #FFF;
}
#menu ul li:hover ul, #menu ul li.sfHover ul {
right:0;
}
#menu ul li ul li:hover ul {
right:170px;
top:0;
}
#menu ul li ul li {
padding:0;
height:auto;
width:170px;
margin:0 0 5px 0;
border-right:none;
}
#menu ul li:hover ul li a {
text-shadow:none;
margin:0;
padding:1px 10px 1px 0px;
line-height:25px;
font-size:14px;
text-align:right;
}
#menu ul li:hover ul li {
background:none;
}
#menu ul li:hover ul li a,
#menu ul li ul li a,
#menu ul li li ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a {
color:#000;
background:none;
border:1px solid #b5c5e5;
}
#menu ul li ul li a:hover,#menu ul li ul li.active a,#menu ul li.active ul li a:hover,#menu ul li li ul li a:hover,#menu ul li ul li.active ul li.active a,#menu ul li ul li.active a,#menu ul li.active ul li a:hover {
color: #000000;
text-decoration: none;
background-color: #7898d8;
background-image: -moz-linear-gradient(top, #7898d8, #4d7dde);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7898d8), to(#4d7dde));
background-image: -webkit-linear-gradient(top, #7898d8, #4d7dde);
background-image: -o-linear-gradient(top, #7898d8, #4d7dde);
background-image: linear-gradient(to bottom, #7898d8, #4d7dde);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#ff70e3e8', endColorstr='#ff28ccca', GradientType=0);
border-color: #28ccca #28ccca #5da8c7;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
border-style:solid; border-width:1px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}
#menu ul li ul ul, #menu ul li:hover ul ul,#menu ul li.sfHover ul ul ul, #menu ul li.sfHover ul ul ul ul {
right:-999em;
padding:5px;
margin:-5px 0 0 0;
}
من فقط میخام یه منو که زیر منو داره رو بتونم نمایش بدم و اندازه و رنگ هاش دست خودم باشه
بامنو ساز ها هم مشکل دارم
چیکارکنم؟
من طبق ی آموزش ویدئویی ی قالب ساده ساختم
ک یه موقعیت برای منو بالای اسلاید شو قراردادم
تا اینجا همه چی درست
اما یجای آموزش میاد کد سی اس اس مربوط به منو (سایز و رنگ تعریف شده بود)رو پاک میکنه و کد زیرو میذاره
با این کار سایت بیشتر بهم ریخت و اون موقعیت به اندازه گزینه های منو که زیر هم میاد باز شد
کد اولیه برای اون موقعیت اینو گذاشتم
#topmenu{
width:800px;
height:40px;
background-color:#000;
border-radius:10px;}
کدی که توی آموزش بود اول گرفت کد بالا رو پاک کرد بعد کد زیر رو پیست کرد
#menu1 {
direction:rtl;
overflow: visible;
color: #000;
position: relative;
z-index: 999;
}
#menu2 {}
#menu {
min-height: 40px;
width:800px;
background-color: #0784e4;
background-image: -moz-linear-gradient(top, #0784e4, #0750e4);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0784e4), to(#0750e4));
background-image: -webkit-linear-gradient(top, #0784e4, #0750e4);
background-image: -o-linear-gradient(top, #0784e4, #0750e4);
background-image: linear-gradient(to bottom, #0784e4, #0750e4);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#F90', endColorstr='#FC0', GradientType=0);
border: none;
-webkit-border-radius: 8px;
-moz-border-radius: 8px; border-radius: 8px;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
*zoom: 1;
}
#menu ul {
margin:0;
padding:0;
}
#menu ul li {
list-style:none;
display:inline-block;
position:relative;
padding:0;
margin:0;
height:40px;
border-left:1px solid #b5c5e5;
font-family:pars,Arial, Helvetica, sans-serif;
}
#menu ul li a {
display:block;
padding:0 15px;
margin:0;
line-height:35px;
text-decoration:none;
font-size:15px;
color:#000;
}
#menu .menu li a {
color: #000;
text-decoration: none;
text-shadow: 0 1px 0 #ffffff;
}
#menu .menu li a:hover {
background-color: transparent;
color: #CE205A;
text-decoration: none;
background-color: #e5e5e5;
-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}
#menu .menu .active a,#menu .nav .active a:hover {
color: #CE205A;
text-decoration: none;
background-color: #e5e5e5;
-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}
#menu ul li a span.menutitle {
display:block;
}
#menu ul li a span.menudesc {
float:right;
clear:both;
font-size:11px;
line-height:12px;
margin:-20px 0 0 0;
font-family:pars,Arial, Helvetica, sans-serif
}
/* submenu */
#menu ul li ul {
position:absolute;
width:170px;
right:-999em;
margin:0;
padding:5px;
background-color: #b5c5e5;
border: 1px solid #dedede;
*border-right-width: 2px;
*border-bottom-width: 2px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
#menu ul li a:hover {
text-decoration:overline;
text-shadow:0px 1px 1px #FFF;
}
#menu ul li:hover ul, #menu ul li.sfHover ul {
right:0;
}
#menu ul li ul li:hover ul {
right:170px;
top:0;
}
#menu ul li ul li {
padding:0;
height:auto;
width:170px;
margin:0 0 5px 0;
border-right:none;
}
#menu ul li:hover ul li a {
text-shadow:none;
margin:0;
padding:1px 10px 1px 0px;
line-height:25px;
font-size:14px;
text-align:right;
}
#menu ul li:hover ul li {
background:none;
}
#menu ul li:hover ul li a,
#menu ul li ul li a,
#menu ul li li ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a,
#menu ul li.active ul li a,
#menu ul li ul li.active ul li a {
color:#000;
background:none;
border:1px solid #b5c5e5;
}
#menu ul li ul li a:hover,#menu ul li ul li.active a,#menu ul li.active ul li a:hover,#menu ul li li ul li a:hover,#menu ul li ul li.active ul li.active a,#menu ul li ul li.active a,#menu ul li.active ul li a:hover {
color: #000000;
text-decoration: none;
background-color: #7898d8;
background-image: -moz-linear-gradient(top, #7898d8, #4d7dde);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7898d8), to(#4d7dde));
background-image: -webkit-linear-gradient(top, #7898d8, #4d7dde);
background-image: -o-linear-gradient(top, #7898d8, #4d7dde);
background-image: linear-gradient(to bottom, #7898d8, #4d7dde);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#ff70e3e8', endColorstr='#ff28ccca', GradientType=0);
border-color: #28ccca #28ccca #5da8c7;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
border-style:solid; border-width:1px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}
#menu ul li ul ul, #menu ul li:hover ul ul,#menu ul li.sfHover ul ul ul, #menu ul li.sfHover ul ul ul ul {
right:-999em;
padding:5px;
margin:-5px 0 0 0;
}
من فقط میخام یه منو که زیر منو داره رو بتونم نمایش بدم و اندازه و رنگ هاش دست خودم باشه
بامنو ساز ها هم مشکل دارم
چیکارکنم؟