HTMLを使ってマークダウンテーブルをオーバーフローさせる方法はありますか？

Question

GitHubページでjekyllを使ってブログを構築しました。私の記事の1つ（マークダウンで書いたもの）には、スマートフォンでオーバーフローしてページ全体の水平スクロールバーを生成するテーブルがあります。

ページ全体ではなくdivだけをオーバーフローさせるために、HTML +マークダウンを書く方法があるかどうかを知りたいと思います。

<div style="overflow-x: scroll;"> 

    |      |ODBC | SSMS | SQLCMD | ISQL| 
    |---      |:---:|:---: |:---: |:---:| 
    |ANSI_NULL_DFLT_ON  | ON | ON | ON  | OFF | 
    |ANSI_NULLS    | ON | ON | ON  | OFF | 

</div> 

Answer 1

いいえ、単純にhtmlラッパーを追加することはできませんが、他にもいくつかのオプションがあります。あなたはKramdownマークダウンエンジンを使用している場合

は、単に（これは必要とされdivタグやマークダウンブロック間の空行を注意してください。）次のスニペットを使用してラッパーを追加します。

<div class="table-wrapper" markdown="block"> 

|      |ODBC | SSMS | SQLCMD | ISQL| 
|---      |:---:|:---: |:---: |:---:| 
|ANSI_NULL_DFLT_ON  | ON | ON | ON  | OFF | 
|ANSI_NULLS    | ON | ON | ON  | OFF | 

</div> 

することができますあなたのsass/cssファイルにcssルールを追加し、ここに隠れてオーバーフローを設定します。

.table-wrapper { 
    overflow-x: scroll; 
} 

これは、選択したテーブルのオーバーフローのみを設定する明確な方法です。