web-dev-qa-db-ja.com

github＆gitlabの問題でマークダウン `` `コードブロック` ``内に長い行を折り返す方法は？

例えば：

```
some very long line; some very long line; some very long line; some very long line; some very long line; some very long line; some very long line; some very long line; some very long line; some very long line; 
```

ユーザーにgithub/gitlabの問題を強制的にスクロールさせます。 code block内にソフトラインラップする方法はありますか？

関連する質問を読みましたが、それらは異なっているように見えます（例：jekyllなど）。

編集：80列に制限するようにコードを手動で編集することは実行可能なオプションではありません（たとえば、コンパイラーの出力/ログなどから貼り付ける場合。これは多くの作業であり、必要ないはずです）

githubmarkdowngitlabword-wrap
25
timotheecour

これはまだ不可能のようです。しかし、いくつかの拡張機能を使用してマークアップを回避することができます-この chrome拡張機能 はかなりクールです。こちら github詳細はこちら

3
Tony Vincent

私自身のために次のソリューションを見つけ、「github」でテストしました：

1）サフィックス「.md」でファイルを作成します

2）<div>タグを使用して、要求された目標を解決します-長い行をいくつかに分割して、マークダウンする1行。

例：

<div>I am
very
long line</div>

次のように表示されます。

I am very long line
1
Valeriy

出力HTMLファイルに以下のCSSを追加するか、リンクされたCSSで編集します

code {
  white-space : pre-wrap !important;
}
1
Tarun Khurana

ser Css のような拡張子を使用します

デフォルトのコードpre code（これも）とgitlab


pre code,  /* stackoverflow */
.md:not(.use-csslab) pre code
 {
  white-space: pre-wrap;
}

pre code pre-wrap

または JSScript triks のような別の拡張機能を使用します

「ラップ/ラップ解除」を切り替えます。

JSセクションでスイッチの初期化を追加：

var ws = function(i,e) { 
  $("pre code").filter(function(){
   var _t = $(this).parent();
    return !_t.has("input[switch").length 
      && _t.get(0).scrollWidth > _t.innerWidth();
  }).before("<input type='checkbox' checked switch title='Wrap/Unwrap' />");
}
$("body").on("change", ws).change();
$(window).bind("scroll", ws);

CSSセクションでスタイルを追加：

pre {position:relative;}
input[type="checkbox"][switch] {
  position: absolute;
  display: block;
  right:0.5em;
  top:0.5em;
}
pre input[switch]:checked + code { white-space: pre-wrap; }
/* pre input[switch]:not(:checked) + code { white-space: pre; } */

enter image description here

0
MrSwed