常連

### 前提・実現したいこと

VS CodeでMarkdownを記述してローカルに保存した画像を表示したいのですが、表示できません。
VS Code自体は先程インストールしたばかりで特別な設定などはしておりません(日本語にしてpast imageという拡張機能を導入したくらいです)。
```
![](google.png)
```
フォルダ階層は以下の通りです。(Test1.mdがMarkdown記述ファイルです)
![](aeeeebcaebcd6aebbad647a6670665b0.png)


単純に画像を表示する機能がないだけだと思い、以下のように記述したところ画像の表示がされました。
```ここに言語名を入力
![](https://teratail.storage.googleapis.com/assets/img/common/icnReloadBtn.png?1536717371869247)
```
また、相対パスの設定か何かがおかしいのかと思い、以下のような記述にしてみても表示されませんでした。
```
![](file:///C:/フォルダまでのパス/google.png)
```

どなたかご教授よろしくお願い致します。

追記
以下のようになっています。
![イメージ説明](b27762345b2471f9199b5e656bee4e41.png)

VS CodeでMarkdownを記述してローカルに保存した画像の表示方法

###前提・実現したいこと
 ←ここにスペースを空けたい

###発生している問題・エラーメッセージ
 ←ここにスペースが空かない

###該当のソースコード
```text
 ←ここにスペースを空けたい
```

###試したこと
 ←ここに半角スペース
 ←ここに全角スペース
          ←ここに全角スペース*10
.          ←行頭以外はスペースが効く


###補足情報(言語/FW/ツール等のバージョンなど)

行頭に半角/全角スペースをいくら突っ込んでも、プレビュー段階で勝手に削除されてしまう。
単純に行頭を1文字下げてテキストを表示したい。

コード中の2行目以降であれば効くが(何故か1行目は効かない)、平文の部分で行いたい。
ヘルプのmarkdownには該当のような項目の記載はなかった。
HTML等は当然無効。

というか半角だけならまだしも全角を勝手に潰すってのはどうなんだ。

![イメージ説明](6599668debf1503d10a41f05165fece5.png)

【teratail】行頭にスペースを入れたい

### 実現したいこと

RedmineのWikiで「Textile記法」と「CommonMark Markdown記法」を混在させたいのですが、やり方はありますか？

より具体的に言うと「Textile記法」で書かれたWikiの中に部分的に「CommonMark Markdown記法」の領域を作ることはできますでしょうか？

### 背景

Redmine5.0以降でWikiの記法（テキスト書式）に「CommonMark Markdown」が指定できるようになりました。そこで、”チェックボックス”など新しい機能を持った「CommonMark Markdown」を使いたいと考えています。

しかし、従来のWikiはすべて「Textile記法」で書かれているため、全体のテキスト書式の設定を「CommonMark Markdown」に変更することはできません。よって、部分的に「CommonMark Markdown」を使って記述することはできないかと考えています。

### 環境

現在はRedmine5.0.5を使用しています。
Redmineのバージョンを最新にすることは可能です。

またプラグインの追加も可能です。

よろしくお願いいたします。

RedmineのWikiで「Textile記法」と「CommonMark Markdown記法」を混在させたい

### 教えていただきたいこと
https://github.com/snym-yt/VisualPMusic
~~上記のリポジトリでindex.htmlを開くと次のような画面になっていると思います．~~
次の画面の下に調べたみたこと2でコードを追記した結果があります．
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2023-11-28/b12a8ef5-5422-496b-ba5b-fada766e669f.png)
この画面の下の方にテキストがあると思うのですが，この部分をMarkdown言語で記述出来るようにindex.htmlを書き換えたいです．
自分でサイトを見たりしながら次のように記述してみたのですが，うまくいかなかったので，なぜだめなのか，どのようにしたらMarkdownで記述できるのか(そもそもそんなことはできないのか)を教えていただきたいです．

加えて，下のテキスト表示欄は大きさ固定で，それ以上の行がある場合はスクロールして見ることが出来るようにもしたいと考えております．

```HTML
<style>
        /* 横幅が長い場合に改行するためのスタイル */
        .scroll-container {
            white-space: pre-wrap;
            word-wrap: break-word;
            overflow-wrap: break-word;
            overflow-x: auto; /* 横スクロール可能にする */
            max-width: 1877px; /* 任意の横幅を指定 */
            max-height: 500px; /* 任意の縦幅を指定 */
            border: 1px solid #ccc; /* 枠線を追加（任意） */
            padding: 10px; /* 任意の余白を指定 */
        }
    </style>

    <div class="scroll-container" id="markdown-container">
      
      ### aaa
      *Lorem ipsum* dolor sit amet, consectetur adipiscing elit. 
      Curabitur vel quam sit amet ligula volutpat condimentum. 
      Sed eu orci vel libero varius suscipit. 
      Nullam condimentum dolor nec efficitur semper. 
      Integer eget dui vitae quam gravida iaculis.
    </div>
```

### デベロッパーツールでのエラー
```
Uncaught TypeError: marked is not a function
    at index.html:53:37
blockly_compressed.min.js:1074 Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD
```

### 調べてみたこと
##### その1
https://fukuno.jig.jp/2725
ひとまずこのサイトを参照し，
```HTML
<script src="https://taisukef.github.io/marked_md/marked.min.js"></script>

Markdownを埋め込むよ
<script>md(`
# h1
## h2
### h3
#### h4
##### h5
###### h6
`)</script>
```
をindex.htmlに入れてみたのですが，そのまま入れただけではMarkdownで表示されていませんでした．

##### その2
https://zenn.dev/yurukei20/articles/5e341723f68bae
この記事見て実装を進めてみましたけど，Markdownの部分は変わらず出来ませんでした．

```HTML
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <script src="https://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/8.2.2/markdown-it.min.js"></script>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/destyle.css@1.0.15/destyle.css"
    />
    <link rel="stylesheet" href="css/style.css"/>

    
    <main class="l-main-editer js-markdown-editer">
      # h1タイトル
      
      ## h2タイトルタイトルタイトルタイトル
      
      ### h3タイトルタイトルタイトルタイトル
      
      ダミーテキストです。
      
      強調したい箇所は**このように強調させる**ことも可能。
      
      - リスト1
      - リスト2
          - リスト2-1
          - リスト2-2
          - リスト2-3
      - リスト3
      - リスト4
      
      リンクは[リンクテキスト](https://yurukei-career.com/)のように記載。引用ブロックは以下。
      
      > 引用ブロックはこのようになる。
      改行もこのように組み込まれる。
      
      ## テーブル
      
      | No | 名前 | 年齢 |
      |---:|----:|:----:|
      | 1  | 山田 |  24 |
      | 2  | 田中 |  48 |
      
      ---
      
      HTMLをそのまま埋め込むことも可能。
      
      <h2>HTMLタイプのh2テキストとテーブル</h2>
      
      <table>
        <tr>
          <th>No</th>
          <th>名前</th>
          <th>年齢</th>
        </tr>
        <tr>
          <td>1</td>
          <td>山田</td>
          <td>24</td>
        </tr>
        <tr>
          <td>2</td>
          <td>田中</td>
          <td>48</td>
        </tr>
      </table>
      
    </main>
    

    <footer class="l-footer">
      <small class="l-footer__small">&copy;&nbsp;yurukei20</small>
    </footer>

    <script src="https://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/8.2.2/markdown-it.min.js"></script>
```

HTMLでMarkdown言語で記述できるスペースを作成

### 前提・実現したいこと

JupyterのMarkdownでの出力において、表自体（表のセルの内容ではなく）を
左に寄せる形で出力したいです。

### 発生している問題・エラーメッセージ

表自体が中央ぞろえのような形で出力されます。
※両画面端までいくような大きな表ではなく、比較的小さな表です。

### 試したこと

Jupyter 表 Markdown
といったキーワードで検索しましたが、
実現したい方法がみつかりませんでした。

### 補足情報（FW/ツールのバージョンなど）
Windows7 32bit
Jupyter 5.0.0
Python 2.7.13
Anaconda custom (32-bit)
IPython 5.3.0
Chrome 64.0.3282.186（Official Build） （32 ビット）

JupyterのMarkdownで表自体を左寄せしたい

VS Code Markdown　で画像がPreviewに表示されません。
ここは初めてなので使い方がうまくないと思いますが、ご容赦ください（ご指摘は歓迎します）

![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-06-30/e9aae459-b212-4ee8-98c9-58e9033c55d6.png)
ワークスペースに記述したマークダウンに画像を表示しようとするとローカルフォルダへの画像の表示ができません。
~~~
![BorderLine種類](img/BorderLine.png)
![qwerty](file:///C:/tmp/BorderLine.png)
![Test](./img/BorderLine.png)
![Test1](../../c#/img/BorderLine.png)


![picture 2](https://images.tetsudo.com/report/305/65_001.jpg)
~~~
インターネットのURLに対しては表示されていますが、このマークダウンファイルを起点とした表示などではうまくいきません。
ワークスペースを起点とかするという話もあったので、念のため　プログラムヒント.code-workspace　のあるフォルダからのパスも書きましたが(Test1)ワークスペースの起点の位置がこのファイルの位置かもわからない程度なのかもしれませんがダメでした。

拡張機能は、使ってもいない Jupytter や、Kite, Markdown All in One, Path Intellisense, PrintCode,Python, Remote WSL, vscode.pdf などなどいろいろ入れています。

Markdown Imageは、いったん入れて外して　Paste Imageを入れましたが、どうやら入れる前と後で変わりはないようです。

なお、OSは　Windows11 Proです。

どうか、よろしくお願いします。

VS Code Markdown　で画像がPreviewに表示されません。

Markdownで下記のようにリストの入れ子を記述する時に、GitHubのMarkdownなど、実装によっては入れ子の行先頭に半角スペース2個以上が必要なようですが、2個以上でないといけない何か明確な理由があるのでしょうか？

```Markdown
- foo
  - bar
- hoge
  - fuga
```

利便性を考えると個人的には半角スペース1個以上で問題ないとは思うのですが、なにか資料などがありましたら教えて下さい。宜しくお願いします。

Markdownでリストの入れ子のインデント数について

初めてこちらを利用させて頂きます、プログラミング未経験な為、至らないところがありましたら申し訳ございません。

### 前提・実現したいこと
内容としては、PC・スマートフォンにて記入したメモ（プレーンテキストファイル）を、HTML形式で見やすく表示させる形を目指しています。
アプリ専用ソフトは必要とせず、ブラウザのみで機種依存しない閲覧方法を考えているためです。

その際、マークダウン形式に似たような表現で処理できればと考えています。
例えば、文章先頭に「###」と記入してあれば、ヘッダー3として扱われ太字や間隔の装飾をして文章を出力できたら望ましいです。

イメージとしては下図の様な単純な内容です。
![![目標イメージ](39ecca0ae1a18a444fdba6968b600ee5.jpeg)


現状は、**テキストファイルを読み込んで表示する**、程度まで出来た形です。

> [HTML5/ JavaScript でテキストファイルを読み込んで表示 - Qiita](https://qiita.com/junya/items/6b7ef4a2184e1f743420)

こちら様のコードを引用利用しました。


### 発生している問題
つぎに躓いている部分は、**表示される文章をどう改変・装飾すれば良いのか**というところです。

0. 装飾判定部分（###等）を元に、ページ内を装飾する。
0. 先頭の装飾判定部分（###等）を自動消去する。


文字列を検索して、条件にあった部分に装飾用classを割り当てる？ような方法をすれば良いのでしょうか。
恐らくJavaScriptを利用するのであろうとは思うのですが、知識が乏しいためご助言頂ければ幸いです。

### 現状のソースコード

```html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>daylog index</title>
</head>
<body>
<pre id="preview" ></pre>
<input type="file" id="getfile" accept="text/*">
<script>file = document.querySelector('#getfile');

file.onchange = function (){
  var fileList = file.files;
  //読み込み
  var reader = new FileReader();
  reader.readAsText(fileList[0]);

  //読み込み後
  reader.onload = function  () {
    document.querySelector('#preview').textContent = reader.result;
  };
};
</script>
</body>
</html>
```
> [HTML5 / JavaScript でテキストファイルを読み込んで表示 - Qiita](https://qiita.com/junya/items/6b7ef4a2184e1f743420)

こちら様のコードを引用利用しました。