Instagram
اخبار سایت :
  • هیچی فقط همیشه سالم و سلامت باشین :دی

آموزش ساخت منوی سایت گوگل – Google

موتور جستجوی قدرتمند گوگل چندی پیش تغییراتی در منوی سایت خود ایجاد کرد. در این مطلب قصد داریم آموزش ساخت چنین منویی , با استفاده از CSS3 را به شما آموزش دهیم.

http://dl.persianscript.ir/img/google-nav.jpg

 

در ابتدا با استفاده از ul و li یک لیست ایجاد میکنیم. شما میتوانید این قسمت را در هر جای قالب قرار دهید تا منو نمایش داده شود

 

<ul>
 <li>Home</li>
 <li>About us</li>
 <li>Our Services</li>
 <li>Our Technologies</li>
 <li>Contact us</li>
</ul>

حالا کافیستکد های CSS را در قسمت style قالب خود قرار دهید.

ul.googleTab				{
	background: #848383;
	padding:0 5px;
	font-size:13px;
	color:#3366cc;
	overflow:hidden;

	background:-moz-linear-gradient(0% 100% 90deg,#f5f5f5, #ffffff);
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#f5f5f5));
}
ul.googleTab li	{
	float:left;
	padding:7px 8px;
	border-top:solid 2px #bad3ea;
}
ul.googleTab li.active{
	border-top: solid 3px #1a54e1;
	color:#363636;
	font-weight:bold;
}
ul.googleTab li:hover	{
	background:#e4ebf8;
	cursor:pointer;
}

 

برای نمایش دمو اینجا و برای دانلود سورس اینجا کلیک کنید

 


نام
ایمیل (منتشر نمی‌شود) (لازم)
وبسایت
:) :( ;) :D ;)) :X :? :P :* =(( :O @};- :B /:) :S
نظر خصوصی
مشخصات شما ذخیره شود ؟ [حذف مشخصات] [شکلک ها]
کد امنیتی
کلاس های آنلاین فعال

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

مدرس: محمد و اقبال
آموزش PHP - جلسه اول
پنجشنبه 04 تیر 1394 - 17:00
هیچ کلاس فعالی موجود نیست.
کاربران آنلاین
آمار
مطالب : 792
نظرات : 4371
تعداد اعضا : 36613
افراد آنلاین : 3
بازدید امروز : 524
بازدید دیروز : 1,284
گوگل امروز : 20
گوگل دیروز : 136
بازدید هفته : 524
بازدید ماه : 31,436
بازدید سال : 377,035
بازدید کلی : 10,771,511