کارهای خلاقانه با css: mouse hover از جمله ساخت منوهای جالب

در این انجمن پیرامون مباحث مختلف phpNuke بحث و تبادل نظر می شود.
نمایه کاربر
afg_graph
کاربر فعال
کاربر فعال
پست: 531
تاریخ عضویت: شنبه 26 فروردین 1391, 9:20 pm
محل اقامت: کابل - افغانستان
تشکر کرده: 91 دفعه
تشکر شده: 215 دفعه
تماس:

کارهای خلاقانه با css: mouse hover از جمله ساخت منوهای جالب

پست توسط afg_graph »

باز هم سلام ...

تقریبا بعد از 3 سال دوباره برگشتم به انجمن بزرگ نیوک فارسی و امیدوارم این مطلب شروع خوبی برای ادامه با نیوک باشه .[CENTER]------------------------------[/CENTER]
مقدمه :

دوتا از ساده ترین و در عین حال شیرین ترین زبان های برنامه نویسی تحت وب CSS و HTML هستند اما متاسفانه اکثراً ما دید کلی نسبت به این ها داریم و هیچ وقت سعی نمی کنیم یه ذره به جزئیات بپردازیم و چیزهایی رو یاد بگیریم که ممکنه به نظر سخت بیاد اما بی نهایت ساده و دلچسب هست. دقیقا مثل مطلبی که امروز قصد داریم آموزش بدیم.



شروع آموزش :

فعلا فقط فایل دمو گذاشتم که حجمش هم خیلی زیاد نیست و اگه فرصت شد حتما یه فایل آموزشی یه همراه دمو آنلاین می زارم.
[CENTER]کدهای استفاده شده در فایل css[/CENTER][CENTER]

کد: انتخاب همه

background: تعین پس زمینه برای صفحه یا باکس

width: تعین عرض باکس یا هر عنصر دیگر صفحه

height: تعین ارتفاع باکس یا هر عنصر دیگر صقحه

border: تعین حاشیه اطراف برای عناصر

margin: ایجاد فاصله از بیرون برای عناصر

padding: ایجاد فاصله از داخل برای عناصر

float: تعین چینش باکس یا دیگر عناصر left , center , right

[/CENTER][CENTER]////////////////////////////////////////////////////////////////////////////////////[/CENTER]


کدهای استفاده شده در فایل html[CENTER]

کد: انتخاب همه


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> : معرفی محتوای صفحه به جستجوگرهای وب

<link href="css/style.css" rel="stylesheet" type="text/css" /> : فراخوانی فایل سی اس اس در صفحه اچ تی ام ال

< div class="نام جعبه"> : فراخوانی کلاس مورد نظر از فایل سی اس اس در صفحه اچ تی ام ال

<img src="آدرس تصویر" alt="nemune"> : بارگذاری تصویر از وب در صفحه اچ تی ام ال

<a href="#">نام لینک</a> : لینک دهی به یک متن یا شیء

[/CENTER]



فقط کافیه فایل نمونه رو ببینید تا متوجه بشید و باز هم اگه مشکلی بود من در خدمتم.
پیوست ها
Sample.zip
فایل نمونه
(1015.45 کیلو بایت) 69 مرتبه دانلود شده
تصویر نمونه
تصویر نمونه
sample.jpg (132.65 کیلو بایت) مشاهده 476 مرتبه


[CENTER] فیس بوک
HTTP://FACEBOOK.COM/BA.WAHEDI


خـــــــط نگـــــــــــــار

HTTP://KHATNEGAR.BLOG.IR
[/CENTER][CENTER]

آموزش ساخت منوی سایت
post385049.html#p385049

تـــلـــگـــرام من
[url=tg://resolve?domain=B_Wahedi]tg://resolve?domain=B_Wahedi[/url]




[/CENTER]

بازگشت به “بحث و تبادل نظر - phpNuke Discussion”