Published on

Sử dụng markdown

Authors
  • Name
    Email
Table of Contents

Sử dụng một số cấu trúc câu lệnh thường dùng trong blog

1. Headings (Định dạng tiêu đề)

  • Input
# Heading h1
## Heading h2
### Heading h3
#### Heading h4
  • Output

2. Heading h2

2.1. Heading h3

2.1.1. Heading h4

3. Biểu diễn code

<pre><code class="language-md">Nội dung</code></pre>

hoặc

	```ngôn ngữ
	Nội dung code


##  4. Ghi chú
- Input

```md
>Đây là ghi chú!
  • Output

Đây là ghi chú!

5. Tạo hyper link

[Nội_dung_hiển_thị](link)

6. Nhúng link ảnh

    ![Nội_dung_hiển_thị_khi_di_chuột_vào_ảnh](link ảnh)

7. Link CDN liên kết từ git

Dấu ??? là tên file upload lên git

CDN liên kết github

https://cdn.jsdelivr.net/gh/DungSherlock/media/???
https://cdn.statically.io/gh/DungSherlock/media/master/???
https://ghcdn.rawgit.org/DungSherlock/media/master/???
https://raw.githubusercontent.com/DungSherlock/media/master/???

CDN liên kết gitlab

https://cdn.statically.io/gl/DungSherlock/media/master/???

CDN cho hình ảnh

  • Các định dạng hỗ trợ GIF, JPEG, PNG, WebP
  • Giới hạn file size: 20MB
  • Dấu ??? là tham số đường link ảnh
  • statically.io
https://cdn.statically.io/img/:url
https://cdn.statically.io/img/:domain/h=:pixel,w=:pixel,q=:percentage/:subpath_sau_main_domain

https://cdn.statically.io/img/raw.githubusercontent.com/f=auto,q=auto/DungSherlock/media/master/thongdiep1.png

  • Cloudinary.com (res.cloudinary.com) - Ảnh từ link trực tiếp
https://cloudinary-a.akamaihd.net/huedung/image/fetch/f_auto,q_auto/https://:url

https://cloudinary-a.akamaihd.net/huedung/image/fetch/f_auto,q_auto/https://raw.githubusercontent.com/DungSherlock/media/master/thongdiep1.png

  • Cloudinary.com (res.cloudinary.com) - Ảnh thumbnail youtube
https://cloudinary-a.akamaihd.net/huedung/image/youtube/:id_youtube.jpg

https://cloudinary-a.akamaihd.net/huedung/image/youtube/Zet9MbWZmWA.jpg

8. Nhúng link video

.embed-video {
    position: relative;
    padding-bottom: 56.25%; /* - 16:9 aspect ratio (most common) */
    /* padding-bottom: 62.5%; - 16:10 aspect ratio */
    /* padding-bottom: 75%; - 4:3 aspect ratio */
    padding-top: 22px;
    height: 0;
    overflow: hidden;
}

.embed-video iframe,
.embed-video object,
.embed-video embed {
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

<div class="embed-video">
<iframe title="" src="https://www.youtube.com/embed/Dmudh-EBwqI'
frameborder="0'
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture'
allowfullscreen="true'
loading="lazy'
srcdoc="<style>*{padding:0;margin:0;overflow:hidden}html,body{height:100%}img,span{position:absolute;width:100%;top:0;bottom:0;margin:auto}span{height:1.5em;text-align:center;font:48px/1.5 sans-serif;color:white;text-shadow:0 0 0.5em black}</style><a href=https://www.youtube.com/embed/Dmudh-EBwqI?autoplay=1><img src=https://i.ytimg.com/vi_webp/Dmudh-EBwqI/maxresdefault.webp alt=''><span>▶</span></a>">
</iframe>
</div>