آموزش و کتاب الکترونیکی

آموزش HTML به زبان ساده – قسمت دهم – مقدماتی

آموزش HTML به زبان ساده - قسمت دهم - مقدماتی آموزش و کتاب الکترونیکی
نوشته توسط مهدی بلوریان

به نام خدا

 

با عرض سلام و وقت بیخر خدمت بازدید کنندگان گرامی وبسایت وان پی سی

در این قسمت از آموزش ، به سراغ لینک ها در HTML خواهیم رفت 

همراهی شما باعث افتخار ماست

 

لینک ها در html :

 

تمامی صفحات وب دارای لینک هستند و وظیفه ی این لینک ها ارتباط صفحه های وب به هم دیگر هستند .

 

 

لینک ها در html (hyperlink)  :

 

html حاوی یک ویژگی به نام hyperlink است که شما میتوانید عکس ، نوشته و یا پرونده دیگری ، به صفحه مورد نظر بروید .

 

 

 

نحوه ی نوشتن کد های لینک در html :

 

در html لینک ها با تگ <a> شناخته و نوشته می شوند ،

به ای نشکل

<a href=”” > متن لینک </a>

 

برای مثال : 

 

<a href=”http://www.1p30.com/”>ورود به سایت وان پی سی </a>

 

– ویژگی href آدرس مقصد لینک را مشخص میکند

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

 

 

 

انواع لینک ها :

1- لینک محلی

 

لینک محلی در html :

 

در لینک های محلی دیگر احتیاجی به نوشتن http://  نیست ، زیر بصورت پیشفرض ، محلی و فقط در وبسایت شما برای جا ب جایی در بین صفحات شما استفاده میشود

 

برای مثال : 

 

<a href=”forum/25-آموزش-html5-css3/”> آموزش HTML 5 و CSS3 </a>

 

 

رنگ ها در لینک های html : 

 

هنگامی شما ماوس خود را به روی یک لینک هدایت میکنید ، بصورت معمول 2 حالت برای شما پیش می اید

 

تبدیل ماوس به فلش دست شکل

رنگ لینک تغییر خواهد یافت

 

به طور پیش فرض، یک لینک به این شکل ها وجود دارد (در تمام مرورگرها):
لینک unvisited زیر خط دار و آبی است
لینک بازدید زیر خط دار و بنفش است
لینک فعال زیر خط دار و قرمز است
شما میتوانید رنگ های پیشفرض را تغییر دهید ، با استفاده از ویژگی های زیر :
<style>
a:link    {color:green; background-color:transparent; text-decoration:none}
a:visited {color:pink; background-color:transparent; text-decoration:none}
a:hover   {color:red; background-color:transparent; text-decoration:underline}
a:active  {color:yellow; background-color:transparent; text-decoration:underline}
</style>
نحوه ی نمایش لینک ها در html :
برای مشخص کردن نحوه ی نمایش نوع لینک ها از ویژگی target باید استفاده شود (به این نوع لینک تارگت هدف نیز گفته می شود ولی بنده برای مفهومی کردن ازا ین روش استفاده میکنم)

 

ممکن است بپسندید :   آموزش HTML به زبان ساده - قسمت هشتم - مقدماتی

<a href=”http://www.1p30.com/”target=”_blank”>وان پی سی</a>

 

انواع نوع نحوه ی نمایش ویژگی target عبارتند از : 

 

_blank  =  نمایش صفحه کلیک شده بر روی تب یا صفحه ی جدید
_self   =   نمایش در همان صفحه (پیشفرض همین است)
_parent   =   مایش محتوای لینک در پنجره والد (معمولا در حالتی استفاده می شود که لینک از یک frame فراخوانی شود)
_top  =  نمایش محتوای لینک در بالاترین سطح (معمولا در حالتی استفاده می شود که چند frame در صفحه وجود داشته باشد و بخواهیم محتوای لینک خارج از فریم ها و در بالاترین سطح نمایش داده شود)
استفاده ار تصاویر به عنوان لینک در html : 
شما میتوانید برای لینک دادن از تصاویر نیز استفاده کنید ، که باید از تگ تو در تو استفاده کنید .
به این شکل :
<a href=”1p30.php”>
  <img src=”smiley.gif” alt=”وان پی سی” style=”width:42px;height:42px;border:0″>
</a>

 

 

ایجاد یک نشانه در صفحه وب در html :

 

– نشانه گذاری در صفحات وب برای وب سایتی است که از محتوای طولانی اسستفاده کرده بدون رفرش دوباره صفحه ، به ان قسمت از صفحه می رویم

– برای این کار ابتدا بای دیک نشانه در صفحه و بعد از ان یک لینک نشانه رو بگذاریم

 

مثال :

 

ایجاد یک نشانه با ویژگی id : 

<h2 id=”tips”>نشانه</h2>

اضافه کردن یه هدف لینک برای نشانه ایجاد شده :

<a href=”#tips”>کلید برای پرش به نشانه</a>

 

یا به قسمتی از نشانه صفحه ی دیگر : 

 

<a href=”html_tips.htm#tips”>کلیک برای پرش به نشانه از صفحه ی دیگر</a>

 

 

اتمام

درباره نویسنده

مهدی بلوریان

دیدگاه بگذارید

avatar
  Subscribe  
Notify of