آموزش استفاده از Markdown برای نوشتن محتوا (جلسه ۹) – کار با لینکها در Markdown

کار با لینک‌ها در Markdown

شما میتوانید با استفاده از تگ a درون HTML، لینک‌های مورد نظر خود را در متن قرار دهید. در لینک دو ویژگی اصلی یعنی ویژگی href و ویژگی title وجود دارد. با استفاده از ویژگی href میتوان آدرسی که لینک به آن اشاره میکند و با استفاده از ویژگی title هم عنوان لینک را مشخص کرد. همچنین ویژگی title برای Accessibility و Screen reader‌ها مناسب است.

برای ساختن لینک‌های موردنظر در Markdown باید از { و [ استفاده کنیم. کد زیر را در نظر بگیرید:

[Assemble](http://assemble.io)

در ابتدای این عبارت، کلمه Assemble درون [] قرار گرفته و این کلمه به عنوان متن لینک در نظر گرفته شده است. بعد از آن آدرس لینک را درون پرانتز یا () قرار دادیم. پس ابتدا متن را درون [] و سپس آدرس مورد نظر را درون () قرار میدهیم. اگر کد بالا را درون ابزار آنلاین Stackedit قرار بدهیم، خروجی بصورت زیر می‌شود:markdown link

خروجی در سمت راست نمایش داده شده و می‌توانید بر روی آن کلیک کرده و به آدرس مورد نظر بروید. زمانی که بر روی لینک مورد نظر هاور می‌کنیم، Tooltip نمایش داده نمی‌شود. در ادامه با استفاده از ویژگی title این کار را هم انجام می‌دهیم. خروجی HTML به‌صورت زیر است:

Assemble

حالا برای اینکه درون Markdown به لینک مورد نظر یک title یا عنوان اضافه کنید، باید بصورت زیر عمل کنید:

[Upstage](https://github.com/upstage/ "Visit Upstage!")

بعد از اینکه آدرس لینک مورد نظر را درون () قرار دادیم، عبارتی که قصد داریم به عنوان title قرار بگیرد را درون ” قرار دادیم. خروجی بصورت زیر می‌شود:markdown link 2

کد HTML خروجی بصورت زیر است:

Upstage

ما از لینکها برای آدرس دادن به جاهای مختلف صفحه داخلی فعلی هم میتوانیم استفاده کنیم. برای این کار درون ویژگی href لینک خود، id المنت مورد نظر را قرار میدهیم. با اینکار اگر بر روی لینک کلیک شود، صفحه اسکرول شده و آن المنت به ما نمایش داده میشود. کد زیر را در نظر بگیرید:

[Chapter 1](#chapter-1)

حالا فرض کنید که یک المنت با id برابر با chapter-1 درون صفحه وجود داشته باد. با کلیک بر روی این لینک به سمت آن المنت فرستاده میشویم.

چه امتیازی به این مقاله می دید؟











نویسنده
محمد اسفندیاری

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

نظر دهید

پاسخ دهید

Logo
بازیابی رمز عبور
مقایسه موارد
  • کل (0)
مقایسه
0