آموزش استفاده از Markdown برای نوشتن محتوا (جلسه 8) - قرار دادن کد و table

- visibility ۰ mode_comment

در این مطلب با ادامه آموزش Markdown در خدمتتون هستیم.

Markdown

روشی دیگر برای قرار دادن کد

در مطلب گذشته بهتون چند روش گفتم که با استفاده از اونا کدهامون رو قرار دادیم. در اینجا میخایم روشی رو به شما بگیم که با استفاده از اون کدهایی که چند خط هستند رو درون تگ code قرار بدین. برای اینکار میتونین از ``` یا سه تا backtick استفاده کنید. پس شما میتونین کدهای چند خطی خودتون رو درون ``` قرار بدین. کد زیر رو در نظر بگیرید:

همونطور که دیدید کدهای مورد نظر رو درون ``` قرار دادیم. اگر این کد رو درون ابزار آنلاین stackedit قرار بدیم، خروجی بصورت زیر خواهد شد:markdown code multuple line

دیدید که خروجی بصورت کد نمایش داده شده. کد HTML خروجی اون بصورت زیر هست:

همونطور که دیدید کدهای مورد نظر درون تگ code قرار گرفتن.

قرار دادن جدول یا table

همونطور که میدونید در HTML جداول رو با استفاده از تگ html بوجود میاریم. هر جدولی دارای تعدادی ردیف و هر ردیف دارای تعدادی سلول هست. در Markdown ردیفها رو با استفاده از خط جدید بوجود میارن و سلولها رو با استفاده از Pipe یا | از هم جدا میکنیم. برای قرار دادن علامت pipe میتونین براحتی کلیدهای ترکیبی Shift و \ رو با همدیگه فشار بدین. مثلا کد زیر رو در نظر بگیرید:

میبینید که درون | عبارتهای مختلفی قرار گرفته. برای اینکه کاراکترهایی که در خط اول قرار گرفتن بعنوان Heading یا عنوان جدول قرار بگیرن و Bold بشن، تعدادی ---- قرار میدیم. تعداد - ها مهم نیس و هر تعدادی میتونه باشه و ما در بالا بعلت اینکه نظم کد Markdown بیشتر بشه و بهتر بتونیم اون رو بخونیم، اینکارو کردیم. هر خط در کد بالا نقش یک ردیف در جدول رو داره. خروجی این کد در ابزار Stackedit بصورت زیر هست:markdown table

خروجی HTML اون هم بصورت زیر هست:

همونطور که دیدید ردیف اول درون تگ thead قرار گرفتن که مخفف Table header هست و نقش عنوان جدول رو ایفا میکنه. همچنین شما میتونین به راحتی با اضافه کردن Colon یا : به انتهای ----، اون ستون رو بصورت راست چین شده در بیارید. برای مثال کد زیر رو در نظر بگیرید:

خروجی این کد بصورت زیر خواهد بود:markdown table 2

همونطور که دیدید ستونهای مورد نظر بصورت راست چین شده در اومدن.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

comment دیدگاه کاربران

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.