آموزش یادگیری html

[sun-shine 7,672]

اول از همه یه تشکر ویژه دارم از خانوم sun-shine بابت این تاپیک آموزش خوب و عالیشون.

مطالب مختصر مفید و تقریبا میشه گفتکامل بود و به راحتی کار آدم رو راه میندازه.

 

پست #4 یه غلظ تایپی در بخش ایجاد خط (تگ HR>) درقسمت کد نویسی وجود داره که به جای تایپ حرف h حرف b تایپ شده .حیفم اومد نگم چون این مطلب بی نقص هستش اینم اصلاح بشه عالیه.

 

حال سوال خودم.

در پست 7 map رو توضیح دادید متوجه شدم سایز تصویر شما با سایزی که در سایت لود شده یکی نیست.

حالا این مشکلی برای پیدا کردن موقعیت و جانمایی هابوجود نمیاره؟

 

سلام آقا ناصر

خیلی خیلی ممنونم بابت این دقتتون :icon_gol:

بله حق با شماست، HR رو اشتباها BR نوشتم ولی متاسفانه نمی دونم چرا امکان ویرایش متن ندارم

واسه عکسم راست میگین، عکس رو که کوچک کردم، دقت نکردم که مختصات نقاطو قبلا دادم :icon_pf (34): ولی خب طریقه بدست آوردن مختصاتشو کامل قبلش گفتم

 

سلام مجدد

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

واسه کسایی که میخوان شروع کنن عالی هستش

سریع تغییرات رو میبینن

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

 

چه سایت جالبیه، مرسی که معرفی کردین :icon_gol:

 

بازم ممنونم

[Just Mechanic 27,854]

بخش ششم: نقشه های تصویری

تصاویر و پیوند:

می توان یک تصویر را نیز بعنوان پیوند در نظر گرفت. تنها کافیست که بصورت زیر، تگ img را داخل تگ باز و بسته a قرار داد.

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

مثال:

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

نقشه های تصویری (تگ map):

در بحث قبلی دیدیم که می توان یک تصویر را بعنوان پیوند انتخاب کرد، حال اگر بخواهیم هر قسمت تصویر، به یک جای خاص پیوند شود، می توانیم از تگ map استفاده کنیم. به این تصویر، نقشه تصویری می گویند. مثلا می توان نقشه ایران را به نقشه تصویری تبدیل کرد تا با کلیک بروی هر استان، به سایت آن استان پیوند داده شود. هر نقشه تصویری، شامل چندین نقطه حساس است که محیط کلیک را مشخص می کنند.

 

به این منظور بصورت زیر عمل می کنیم:

1. برای تگ map، یک خاصیت با نام name نوشته و یک نام به آن اختصاص می دهیم.

 

2. برای عکس، خاصیتی بنام usemap تعریف می کنیم که مقدار آن باید برابر با خاصیت name مربوط به تگ map باشد. قبل از اسم، علامت # گذاشته می شود.

 

3. در تگ map، یک تگ بدون فرزند area می نویسیم. این تگ دو خاصیت مهم دارد که عبارتند از:

الف- shape: که نوع شکل نقشه است و سه مقدار می گیرد: circle(دایره)، Rect(مستطیل) و Poly(چندضلعی) می گیرد.

 

ب-coords: مهمترین قسمت نقشه تصویری، دادن مختصات است که برای هر کدام از سه نوع، بصورت زیر است:

 

شکل را در نرم افزار paint باز کرده و برای بدست آوردن مختصات هر نقطه که نیاز دارید، کافیست که ماوس را روی آن نقطه نگه دارید تا مختصات x و y آن در گوشه پایین سمت چپ نشان داده شود.

• دایره: سه مقدار می گیرد که مختصات x و y نقطه مرکزی و شعاع دایره است.
  

​

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

• مستطیل: در مستطیل خاصیت coords چهار مقدار می گیرد که بصورت زیر است.
  

​

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

• چند ضلعی: در چند ضلعی، برای نوشتن مختصات، طول و عرض نقاط را در کنار هم می نویسیم. نکته مهم در چند ضلعی اینست که باید نقطه اول و آخر یکی باشد یعنی مختصات نقطه اول، باید در آخر نیز آورده شود تا بصورت محیط بسته شود. می توان مختصات نقاط منحنی را نیز به این صورت بدست آورد.
  

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

مثال:

در مثال زیر، هر سه نوع shape را استفاده کردیم. این مناطق در شکل با رنگی متمایز، نشان داده شده است.

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

خروجی مثال:

زمانی که ماوس بروی مناطق مشخص قرار داده شود، شکل کرسل ماوس به شکل دست تغییر می کند و با کلیک بروی این مناطق، به لینک های مشخص منتقل می شود.

 

تمرینات این قسمت:

 

اولی رو من با فایل های ذخیره شده انجام دادم و در واقع فایلها در جایی ذهخیره شده و آدرس فایلهای ذخیره شده رو بهشون دادم

روی لینک زیر کلیک کنید تاببینید

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

 

در دومی من بااکلیک روی سه قسمت مشخص شده به مسیرهایی از ویکی پدیا هدایت میشید

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام

[Just Mechanic 27,854]

برای مشاهده این محتوا لطفاً ثبت نام کنید یا وارد شوید.

• ورود
• یا
• ثبت نام