HTML - الدرس الثالث التعامل مع الروابط Link

بسم الله الرحمن الرحيم

1 - إضافة رابط عادي الى صفحة الويب ... 
- الوسم <a href="http://My Site">Name of Link</a> يستخدم لصنع رابط في الصفحة وسيتم فتحه في نفس الصفحة .
<a href="https://tech-secu.blogspot.com">open in this page</a>

أما في حال وضع target="_blank" فإن الرابط سيتم فتحه في صفحة جديدة .
<a href="https://tech-secu.blogspot.com" target="_blank">open in another</a>

2 - إضافة رابط على شكل صورة الى صفحة الويب ...
- الوسم
<a href="http://My Site"><img src="MyPhoto.gif" ></a></p>
ويستخدم لإضافة رابط على شكل صورة بحيث ننتقل للرابط بمجرد الضغط على الصورة .
<a href="https://tech-secu.blogspot.com"><img src="http://im73.gulfup.com/xmjJEh.jpg" ></a></p>

- إذا كان حجم الصورة كبير جدا بحيث يغطي الصفحة وأردت التحكم بحجم الصورة يمكن اضافة width="42" height="42" حيث أن width هي العرض و width هي الطول .
- كما يمكن اضافة title="Hacker" لإظهار عنوان عند وضع الماوس فوق الصورة.
<a href="https://tech-secu.blogspot.com"><img src="http://im73.gulfup.com/xmjJEh.jpg" width="42" height="42" title="Hacker"></a></p>

3 - إضافة رابط بريد الكتروني - ايميل ...
- الوسم
<a href="mailto:someone@example.com?Subject=Hello%20Hacker" target="_top">
Send Mail</a>

ويضاف له Subject وهي للعنوان وكما نلاحظ نستخدم %20 بدلاً من المسافة لنتأكد من أن المتصفح سيفهمها ويتعمال معها على أنها مسافة .
<a href="mailto:khaledk98@yahoo.com?Subject=Hello%20Hacker" target="_top"><br /> Send Mail</a>

4 - إضافة رابط للإنتقال من سطر إلى سطر أخر داخل الصفحة ...
- الوسم
<a href="#C4">Go to line 2</a>
        line 1
<a id="C4">line 2</a>
وفي هذا الوسم سينتقل الرابط C4 عند الضغط عليه إلى السطر رقم 2 كما حددنا له في الكود .
مثال : في الكود التالي سنجعل الرابط ينتقل من الرابط في أول الصفحة الى السطر 17 في نهايتها :
<a href="#C4">Go to line 17</a><br /> <h2>line 1</h2><h2>line 2</h2><h2>line 3</h2><h2>line 4</h2><h2>line 5</h2><h2>line 6</h2><h2>line 7</h2><h2>line 8</h2><h2>line 9</h2><h2>line 10</h2><h2>line 11</h2><h2>line 14</h2><h2>line 15</h2><h2>line 16</h2><h2><a id="C4">line 17</a></h2>
و الان عند الضغط هنا سينتقل الرابط الى بسم الله الرحمن الرحيم في اعلى الصفحة