markdown basics
on this page
Quick reference for the most commonly used markdown syntax in this site.
Text Formatting
**bold text**
_italic text_
**_bold and italic_**
~~strikethrough~~
`inline code`
Results in: bold text, italic text, bold and italic, strikethrough, inline code
Headings
## Section Heading
### Subsection
#### Minor Section
Links
[Link text](https://example.com)
[Wiki page](/wiki/page-slug)
[Blog post](/blog/post-slug)
Lists
Unordered Lists
- First item
- Second item
- Nested item
- Another nested item
- Third item
Ordered Lists
1. First step
2. Second step
1. Sub-step A
2. Sub-step B
3. Third step
Task Lists
- [x] Completed task
- [ ] Pending task
- [ ] Another pending task
Code Blocks
Basic Code Block
```javascript
const greeting = 'Hello World';
console.log(greeting);
```
With Filename
example.js markdown
```javascript filename="example.js"
function fibonacci(n) {
if (n <= 1) return n;
return fibonacci(n - 1) + fibonacci(n - 2);
}
```
With Line Highlighting
```javascript filename="app.js" {2,4-6}
const express = require('express');
const app = express(); // This line is highlighted
app.get('/', (req, res) => {
// These lines
res.send('Hello World!'); // are also
}); // highlighted
app.listen(3000);
```
Results in:
app.js javascript
const express = require('express');
const app = express(); // This line is highlighted
app.get('/', (req, res) => {
// These lines
res.send('Hello World!'); // are also
}); // highlighted
app.listen(3000);
Inline Code
Use single backticks for inline code: npm install astro
Blockquotes
> This is a blockquote.
> It can span multiple lines.
>
> And include multiple paragraphs.
This is a blockquote. It can span multiple lines.
And include multiple paragraphs.
Images
Basic Images

Images with Captions
For images that need captions, use the Figure component in MDX files:
blog-post.mdx jsx
import Figure from '@components/ui/Figure.astro';
import bookPhoto from '@assets/images/books.png';
<Figure
src={bookPhoto}
alt="Collection of programming books"
caption="My collection of O'Reilly books from the early 2000s"
width={800}
/>
This provides proper semantic HTML with <figure>
and <figcaption>
elements, better accessibility, and consistent styling.
Tables
| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Cell 1 | Cell 2 | Cell 3 |
| Cell 4 | Cell 5 | Cell 6 |
Column 1 | Column 2 | Column 3 |
---|---|---|
Cell 1 | Cell 2 | Cell 3 |
Cell 4 | Cell 5 | Cell 6 |
Horizontal Rule
Use three or more hyphens:
---
Math (in MDX files)
Inline math:
Block math:
MDX Features
Since this is an MDX file, you can also use React/Astro components. For example, you could import and use custom components for more complex content.
══════════════════════════════════════════════════════════════════