# Zenn 独自の記法1
aaa

## Zenn 独自の記法2
aaa

### Zenn 独自の記法3
aaa

#### Zenn 独自の記法4
aaa

##### Zenn 独自の記法5
aaa

here is sample content of markdown using `zenn-markdown-html`, and`zenn-content-css`.

### list sample

- test1
- test2
- test3
  - test3-1
  - test3-2

### 数式サンプル

$$
e^{i\theta} = \cos\theta + i\sin\theta
$$

### コードサンプル

```diff
- import markdownToHtml from '../../lib/markdownToHtml'
+ import markdownToHtml from 'zenn-markdown-html';

type Props = {
    post: PostType
    morePosts: PostType[]
    preview?: boolean
}

const Post = ({post, morePosts, preview}: Props) => {
    const router = useRouter()
    if (!router.isFallback && !post?.slug) {
        return <ErrorPage statusCode={404}/>
    }
    return (
        <Layout preview={preview}>
            <Container>
                <Header/>
                {router.isFallback ? (
                    <PostTitle>Loading…</PostTitle>
                ) : (
                    <>
-                        <article className="mb-32" >
+                        <article className="mb-32 znc" > // CSSが反応できるようにクラスを追加します
                            <Head>
                                <title>
                                    {post.title} | Next.js Blog Example with {CMS_NAME}
                                </title>
                                <meta property="og:image" content={post.ogImage.url}/>
                            </Head>
                            <PostHeader
                                title={post.title}
                                coverImage={post.coverImage}
                                date={post.date}
                                author={post.author}
                            />
                            <PostBody content={post.content}/>
                        </article>
                    </>
                )}
            </Container>
        </Layout>
    )
}
```

### テーブルサンプル

| ID                        | Title                                               | Score | Display Value | Description |
|---------------------------|-----------------------------------------------------|-------|---------------|-------------|
| is-on-https               | Uses HTTPS                                          | 1.00  | N/A           | All sites should be protected with HTTPS, even ones that don't handle sensitive data. This includes avoiding mixed content. HTTPS prevents intruders from tampering with or passively listening in on the communications between your app and your users. |
| redirects-http            | Redirects HTTP traffic to HTTPS                     | N/A   | N/A           | Make sure that you redirect all HTTP traffic to HTTPS in order to enable secure web features for all your users. |
| viewport                  | Has a `<meta name="viewport">` tag with `width` or `initial-scale` | 1.00  | N/A           | A `<meta name="viewport">` not only optimizes your app for mobile screen sizes, but also prevents a 300 millisecond delay to user input. |
| first-contentful-paint    | First Contentful Paint                              | 0.88  | 1.9s          | First Contentful Paint marks the time at which the first text or image is painted. |
| largest-contentful-paint  | Largest Contentful Paint                            | 0.00  | 10.4s         | Largest Contentful Paint marks the time at which the largest text or image is painted. |
| first-meaningful-paint    | First Meaningful Paint                              | 0.96  | 1.9s          | First Meaningful Paint measures when the primary content of a page is visible. |


### 埋め込みサンプル

https://github.com/metabase/metabase/issues/3324

https://x.com/akibablog/status/1817410232202744076

MarkdownTest | members_only && subscribers_only

qbm_test

qbm_test

About us

SNS

blueqat Co., Ltd.