آموزش برنامه نویسی ، پایگاه داده sql server
آموزشگاه برنامه نویسی تحلیل داده : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server


آموزشگاه برنامه نویسی مجتمع فنی تهران میرداماد : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server

تصاوير HTML

تگ < area > , < map > :

ايجاد يک نقشه تصويری ( يک عکس با نواحی مختلف قابل کليک شدن ) :
از تگ < map > برای ايجاد يک نقشه تصويری استفاده می شود . يک نقشه تصويری , عکسی است که ناحيه های متفاوت آن قابل کليک کردن بوده که می توان با کليک بر روی هر قسمت به يک صفحه يا فايل ديگر پيوند بر قرار کرد .
هر تگ < area > در درون تگ < map > ، می تواند تعيين کننده يک ناحيه مجزا قابل کليک شدن باشد که با تعيين مختصات آن بر روی عکس ، آن ناحيه مشخص می شود .

نکته مهم : ما ابتدا به وسيله تگ < map > و تگ های درونی < area > يک نقشه تصويری با نواحی مختلف قابل کليک شدن ايجاد کرده ، سپس آن نقشه را به يک عکس بر روی صفحه پيوند می دهيم .
برای اين کار خاصيت usemap را در تگ < img > عکس مورد نظر برابر نام Name يا id ، نقشه تصويری ايجاد شده قرار می دهيم . برای درک بهتر به مثال دقت کنيد :

خواص مهم تگ map
نام خاصيت نوع خاصيت شرح
name
يا
id
name
نام
يک نام منحصر به فرد برای نقشه تصويری تعيين می کند .

خواص مهم تگ area
نام خاصيت نوع خاصيت شرح
Coords
ابتدا به خاصيت shape توجه کنيد .
مشخص کننده مختصات نقاط مختلف يک چند ضلعی (مربع ، مستطيل و ... ) برای تعيين ناحيه مورد نظر از عکس برای ايجاد پيوند است که دارای حالت های زير است :
rect : مربع . تعيين کننده مختصات چهار نقطه مختلف يک مربع يا مستطيل
coords =left,top,right,bottom
circ : دايره . مشخص کننده نقطه مرکز و شعاع يک دايره
coords=center X, center Y ,radius
poly : چند ضلعی . مشخص کننده مختصات انواع نقاط مختلف يک چند ضلعی
coords = X1 Y1, X2 Y2, ... , Xn Yn
href URL
مسير و نام فايل
برای تعيين آدرس کامل صفحه يا فایل مقصد پيوند به کار می رود .
nohref true
false
در صورتی که مقدار آن برابر true باشد ، آن ناحيه از عکس فعال و قابل کليک کردن بوده و در صورت false بودن غير فعال است .
shape rect
rectangle
circ
circle
poly
polygon
شکل ناحيه قابل کليک شدن از يک عکس يا نقشه تصويری را تعيين می کند ، که مختصات آن توسط خاصيت coords در همين تگ مقدار دهی می شود و. انواع اشکال ممکن عبارتند از :
rect , rectangle : مربع يا مستطيل
circ , circle : دایره يا بيضی
poly , polygon : چند ضلعی
target _blank
_parent
_self
_top
نحوه باز شدن و نمايش پنجره صفحه مقصد را تعيين می کند که دارای حالت های زير است:
- blank : لينک در يک پنجره جديد باز خواهد شد .
- self : لينک در همان پنجره يا قابی که کليک شده است باز خواهد شد .
-parent : لينک در قاب اصلی يا مادر باز خواهد شد .
-top : لينک در همان پنجره ای که کليک شده است به طور کامل باز خواهد شد .

مثال : در تصوير زير برای رفتن به توضيح در مورد هر تگ ، بر روی قسمت مربوط به آن کليک کنيد :

Example
< img src="../Pic/TagsList.jpg" alt="learner" usemap="#taglist" />
< map id="taglist" >
    < area id="table" alt="table tag" shape="rect" coords="1, 2, 194, 122" href="HtmlTable1.aspx" />
    < area id="body" alt="body tag" shape="rect" coords="194, 0, 386, 119" href="basictags1.aspx" />
    < area id="link" alt="link tag" shape="rect" coords="0, 121, 193, 242" href="HtmlLinks2.aspx" />
    < area id="p" alt="p tag" shape="rect" coords="192, 119, 386, 242" href="textformat1.aspx" />
< /map >
کد
learner table tag body tag link tag p tag خروجی


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نظر خودتان درباره این صفحه را با ما در میان بگذارید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : فرزند بچه شما چه نسبتی با شما دارد ؟