Skip to content

TutulDevs/MD

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

40 Commits
 
 
 
 
 
 

Repository files navigation

Mastering Markdown

Paragraph

This is a demo paragraph with no styling. While MD keep a line space after any line for breaking.

If you write without spacing, it'll be a single paragraph.

Two sets of _ or * make bold

One set of * makes it italic

Two sets of ~ (tilda) make strike through

Headers & linkers

Heading 1

Heading 2

Heading 3

GitHub or some other tools make this # sings as ID like an HTML page.

Linking

There're many ways to make links.

www.all-js.netlify.app shows w/o anything

http://all-js.netlify.app use <> to display, but use http://. Otherwise it'll display the <> as well

My GitHub Acc For nicer display

My Twitter This link has a title w/ it

You can use token to store a link so that you can use it anywhere w/o being verbose. The token is more like a varible. It's very handy.

MD Images

woohoo

Make a small picture linked to the bigger version of it by using nested MD.

Big Img

The ! menas it's going to be an image. [] for alt text(skippable).() for linking.

You can use token to link w/ title. No problem

Pro Tip: if you can't figure out anything on MD, just use regular in HTML inside <> 😎

Regular HTML & CSS

This is in a p tag & styled by CSS.

🔷 GitHub is not showing the custom CSS edits. Boo!

<style> p.para { color: #ddd; font-size: 20px; background: salmon; padding: 5px; transform: skew(20deg); } h2 { color: teal; border-bottom: 1px solid crimson; padding-bottom: 5px; } blockquote { border-left: 3px solid #ddd; padding-left: 5px; } </style>

List (ordered, unordered, bullet, nested)

  • For unordered list
  • or bullet list
  • use */ - / + before the item.
  • The parser knows it's an unordered list.
  1. This is ordered list .
  2. Just put a number & . (1.) to start
  3. ✌️
  4. Your ordered list.
  5. Don't worry about the serial number for later changes.
  6. The parser will display as from 1 - n. Just like the #3 item.
  • This is nested link
  • Nesting inside.

This is a para inside the nested list. Add image or anything here.

  • Nesting off.

Code Block

const x = 5 - 3 ;

Line Break, Horizontal Rule

For line break, use br tag of HTML or use line space.

For horizontal rule use 3 dashes(-) or 3 equal signs(=). But make sure those are not below any text. Otherwise the text will be H1.
The = is not working in this app 😐


⬆ is an example of horizontal line(---). Doesn't working in (===).

Blockquote

Put a right chevron before the line to quote.

This parser is not showing the left border. Damn!

So I added that in CSS 😎

Tables

Tables are just basically done by using pipes(|)

Name Age
John 25
Mia 22
Tutul 27

Checkbox

[ ] Watch WesBos' Tutorial

[x] Post them in Twitter

[ ] Be awesome 😎

My parser is not showing checkboxes 😐

This file is made with the help of WesBos' tutorial. Many thanks to him.

About

Collection of MarkDowns

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published