کد منوی لینکدونی زیبا 2 با استفاده از css

کدستان سایت

حتما طراحی این کد رو بلد نیستید اما من این کد رو برای شما طراحی کردم به صورتی بسیار زیبا همونطور که در دمو می بینید بسیار زیباست.
کد لینکستان را می توانید در هر جایی از قالب قرار دهید.
این کد بر اساس css درست شده است و در ورژن 9 اینترنت اکسپلورر عمل می کند اما نه به زیبایی بقیه مرورگر ها.

<head> <style type="text/css"> .moisrex-link-two { width: 300px; height: 300px; padding:5px; font-family:Tahoma; font-size:12px; text-align:right; overflow:auto; direction:rtl; box-shadow:0px 0px 10px 0px burlywood inset; -moz-box-shadow:0px 0px 10px 0px burlywood inset; -o-box-shadow:0px 0px 10px 0px burlywood inset; -ms-box-shadow:0px 0px 10px 0px burlywood inset; -webkit-box-shadow:0px 0px 10px 0px burlywood inset; border-radius:5px; background:url(http://www.w3schools.com/css/img_flwr.png) left bottom no-repeat blanchedalmond scroll; } .moisrex-link-two a{ color:chocolate; font-size:12px; text-decoration: none; text-shadow:0px 0px 1px chocolate; -moz-text-shadow:0px 0px 1px chocolate; -o-text-shadow:0px 0px 1px chocolate; -ms-text-shadow:0px 0px 1px chocolate; -webkit-text-shadow:0px 0px 1px chocolate; transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; } .moisrex-link-two a:hover{ margin:0 5px 0 0; text-shadow:0px 0px 5px chocolate; -moz-text-shadow:0px 0px 5px chocolate; -o-text-shadow:0px 0px 5px chocolate; -ms-text-shadow:0px 0px 5px chocolate; -webkit-text-shadow:0px 0px 5px chocolate; } .legend-two{ width:100px; font-family:Tahoma; font-size:13px; color:darkgoldenrod; font-weight:normal; background-color:blanchedalmond; box-shadow:0px 0px 10px 0px burlywood; -moz-box-shadow:0px 0px 10px 0px burlywood; -o-box-shadow:0px 0px 10px 0px burlywood; -ms-box-shadow:0px 0px 10px 0px burlywood; -webkit-box-shadow:0px 0px 10px 0px burlywood; border-radius:5px 5px 0px 0px; -moz-border-radius:100px 100px 0px 0px; -o-border-radius:100px 100px 0px 0px; -ms-border-radius:100px 100px 0px 0px; -webkit-border-radius:100px 100px 0px 0px; } .moisrex-link-two a:hover:after{content:" (آدرس لینک:"attr(href)")";color:#999;font-size:9px;font-family:tahoma;)} .ul-two{list-style:none;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px} .ul-two li{background:url(http://www.famo.ir/wp-content/themes/wtj-famo/images/i/bullet_yellow.png) center right no-repeat;padding:1px 15px 1px 1px;margin:0px 0px 0px 0px;} </style> </head> <body> <center> <div class="legend-two">کدستان سایت</div> <div class="moisrex-link-two"> <ul class="ul-two"> <li><a href="http://moisrex.rozblog.com/">کدستان</a></li> <li><a href="http://www.google.com/">گوگل</a></li> <li><a href="http://search.yahoo.com/">یاهو</a></li> <li><a href="http://www.msn.com/">ام اس ان</a></li> <li><a href="http://www.bing.com/">بینگ</a></li> <li><a href="http://www.microsoft.com/">مایکروسافت</a></li> <li><a href="http://www.mozilla.org/">فایرفاکس</a></li> <li><a href="http://windows.microsoft.com/en-us/internet-explorer/products/ie/home/">اینترنت اکسپلورر</a></li> <li><a href="https://www.google.com/intl/en/chrome/">گوگل کروم</a></li> <li><a href="http://www.apple.com/safari/">سافاری</a></li> <li><a href="/">لینک</a></li> <li><a href="/">لینک</a></li> <li><a href="/">لینک</a></li> <li><a href="/">لینک</a></li> <li><a href="/">لینک</a></li> </ul> </div> <a href="http://moisrex.rozblog.com/"> </a> </center> </body>

1 نظر

2753 بازدید

جمعه 29 اردیبهشت 1391 - 0:07

farid در تاریخ 1393/10/28 ساعت 12:19 می گوید :

سلام
اسکرولشو چجوری تغیر بدم زیبا بشه؟
تعداد لینکام زیاده اسکرول دار میشه
میخوام اسکرولش زیبا بشه
چه کنم خواهشن راهنمایی بفرمایید

پاسخ : اسماعیل : توی 1ابزار کد تغییر اسکرول هست...
با تشکر

کلاس های آنلاین فعال

برای افزایش دانش عمومی کاربران سعی بر این داریم که کلاس های آنلاینی برگزار کنیم. لیست این کلاس (ها) را می توانید در زیر ببینید. این قسمت را هر روز چک کنید تا از کلاس ها و اخبار جدید با خبر شوید. کلاس ها توسط همین کاربران و دوستان شما برگزار میشود. اگر مایل به برپایی کلاس آموزشی ای در هر زمینه ای هستید با مدیر تماس بگیرید.

آموزش PHP - جلسه اول

پنجشنبه 04 تیر 1394 - 17:00

هیچ کلاس فعالی موجود نیست.

کاربران آنلاین

آمار

مطالب : 792
نظرات : 4504
تعداد اعضا : 37335
افراد آنلاین : 47
بازدید امروز : 419
بازدید دیروز : 1,659
گوگل امروز : 2
گوگل دیروز : 29
بازدید هفته : 2,078
بازدید ماه : 2,078
بازدید سال : 270,726
بازدید کلی : 14,271,063

عنوان کد:
توضیحات: