رفتن به مطلب

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

با سلام

من یک منو آبشاری در سایت نصب کردم ولی هر کاری می کنم وسط نمیاد!! کدهای html و CSS این منو رو قرار دادم دوستان لطف کنن راهنمایی کنند چه کنم؟؟؟

آدرس سایت: گروه صنعتی هیدروفنّ

کد HTML

<div class="jDesign_green__menu">

<ul id="jDesign_topnav">

<li><a href="">صفحه اصلی</a></li>

<li>

<a =" ">عضویت </a>

<span>

<a href="/register">عضویت در سایت</a>

<a href="/page/sms">عضویت در سامانه پیامکی</a>

</span>

</li>

<li>

<a href="/forum">تالار گفتمان</a>

</li>

<li>

<a ="">منوی اصلی</a>

<span>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

</span>

</li>

<li>

<a ="">منوی اصلی</a>

<span>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

</span>

</li>

<li>

<a ="">منوی اصلی</a>

<span>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

</span>

</li>

<li>

<a ="">منوی اصلی</a>

<span>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

</span>

</li>

<li>

<a ="">منوی اصلی</a>

<span>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

<a href="">زیر منو</a>

</span>

</li>

</ul>

</div>

کد CSS

*{font-size:11px;margin:0;padding:0;font-family:Tahoma;line-height:150%;}

A{color:#444444;font-size:11px;text-decoration:none;text-shadow:0 0 5px #ccc;behavior:url(PIE.htc);}

.jDesign_blue__menu {width: 950px; margin: 0 auto;}

ul#jDesign_topnav {

margin: 0; padding: 0;

float: right;

width: 950px;

list-style: none;

position: relative;

font-size: 1.2em;

background:url(http://s3.picofile.com/file/7678247632/qqz.png) repeat-x;

font-family: Tahoma;

}

ul#jDesign_topnav li {

float: right;

margin: 0; padding: 0;

border-right: 1px solid #555;

}

ul#jDesign_topnav li a {

padding: 10px 15px;

display: block;

color: #f0f0f0;

text-decoration: none;

}

ul#jDesign_topnav li:hover {background: #7FAA07 url (http://s1.picofile.com/file/7678228274/qqqa.png) repeat-x; }

ul#jDesign_topnav li span {

float: right;

padding: 5px 0;

position: absolute;

left: 0; top:35px;

display: none;

width: 950px;

background: #7FAA07;

color: #fff;

-moz-border-radius-bottomright: 5px;

-khtml-border-radius-bottomright: 5px;

-webkit-border-bottom-right-radius: 5px;

-moz-border-radius-bottomleft: 5px;

-khtml-border-radius-bottomleft: 5px;

-webkit-border-bottom-left-radius: 5px;

}

ul#jDesign_topnav li:hover span { display: block; }

ul#jDesign_topnav li span a {float: right; display: inline; }

ul#jDesign_topnav li span a:hover {float: right; color:#fff;background:#202020;text-shadow:2px 1px 3px #000;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:2px;-webkit-transition-property:background;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear, ease-in;-moz-transition:background .3s ease-in;-o-transition:background .3s ease-in;}

ویرایش شده توسط Black_sky
برای کدهای بلند از longbox استفاده کنید
لینک به ارسال

واقعا ممنون کاملا جواب داد... بهترین انجمن ایران که همیشه جواب سوالامو گرفتم :wub:

پس من کد ویرایش شده CSS رو که وسط چین شده می زارم تا هرکی هم خواست از این منو آبشاری زیبا استفاده کنه

*{font-size:11px;margin:0;padding:0;font-family:Tahoma;line-height:150%;}

A{color:#444444;font-size:11px;text-decoration:none;text-shadow:0 0 5px #ccc;behavior:url(PIE.htc);}

.jDesign_blue__menu {width: 950px; margin: 0 auto;}

ul#jDesign_topnav {

margin:0 auto;

width: 950px;

height: 35px;

list-style: none;

position: relative;

font-size: 1.2em;

background:url(http://hydrofann.com/wp-content/uploads/2014/05/green.png) repeat-x;

font-family: Tahoma;

}

ul#jDesign_topnav li {

float: right;

margin: 0; padding: 0;

border-right: 1px solid #555;

}

ul#jDesign_topnav li a {

padding: 10px 15px;

display: block;

color: #f0f0f0;

text-decoration: none;

}

ul#jDesign_topnav li:hover {background: #7FAA07 url (http://hydrofann.com/wp-content/uploads/2014/05/green2.png) repeat-x; }

ul#jDesign_topnav li span {

float: right;

padding: 5px 0;

position: absolute;

left: 0; top:35px;

display: none;

width: 950px;

background: #7FAA07;

color: #fff;

-moz-border-radius-bottomright: 5px;

-khtml-border-radius-bottomright: 5px;

-webkit-border-bottom-right-radius: 5px;

-moz-border-radius-bottomleft: 5px;

-khtml-border-radius-bottomleft: 5px;

-webkit-border-bottom-left-radius: 5px;

}

ul#jDesign_topnav li:hover span { display: block; }

ul#jDesign_topnav li span a {float: right; display: inline; }

ul#jDesign_topnav li span a:hover {float: right; color:#fff;background:#202020;text-shadow:2px 1px 3px #000;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:2px;-webkit-transition-property:background;-webkit-transition-duration:.3s;-webkit-transition-timing-function:linear, ease-in;-moz-transition:background .3s ease-in;-o-transition:background .3s ease-in;}

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

خداشکر به جواب رسیدید اما:

1-برای کدهای بلند از longbox استفاده کنید

2-عنوان هم ویرایش شد

موفق باشید

لینک به ارسال

لطفا برای ارسال دیدگاه وارد شوید

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



ورود به حساب کاربری
×
×
  • اضافه کردن...