0

下の写真のように：

ここに画像の説明を入力してください

私が話していることを明確に指摘するために、私はすべての前のスペースを意味します。、+、]、| 、および=。おそらく他の場所で出てくる他の句読点と同様に。

pygments.rbとRedcarpetgemを使用して、マークダウンに追加するコードブロックをフォーマットしています。各コードブロックは、このSASSでスタイル設定された.codebox divで囲まれています（実際のファイルを右にタブで移動します）。

.highlight
  pre
    white-space: pre
    overflow: scroll
    word-wrap: normal

.codebox
    margin: auto
    margin-top: 15px
    margin-bottom: -5px
    padding-right: 8px
    padding-left: 8px
    padding-top: 5px
    padding-bottom: 5px
    padding-top: -20px
    background-color: $codebox
    p
        font-family: 'Rockwell Bold'
        &::selection
            background: $pigPink
            color: #fff
        &::moz-selection
            background: $pigPink
            color: #fff
    pre
        font-family: 'Rockwell Bold'
        font-size: 90%

そしてもちろん、マークダウン`バックティック。関連する場合は、pygmentsの構成設定を次に示します。

application_helper.rb

  class HTMLwithPygments < Redcarpet::Render::HTML
    def block_code(code, language)
      Pygments.highlight(code, lexer: language)
    end
  end

  def markdown(text)
    renderer = HTMLwithPygments.new(hard_wrap: true)
    options = {
      nowrap: true,
      autolink: true,
      no_intra_emphasis: true,
      fenced_code_blocks: true,
      lax_html_blocks: true,
      strikethrough: true,
      superscript: true
    }
    Redcarpet::Markdown.new(renderer, options).render(text).html_safe
  end
4

1 に答える 1

0

コメントで述べたように、結果のコードブロックのcssをWebインスペクターで確認することをお勧めします。Pygmentsは、結果のコードブロックのさまざまなトークンにさまざまなcssルールを適用することで機能します。あなたが持っているcssのいくつかがこの出力と衝突してあなたが目撃している効果を生み出している可能性があります、またはコードブロックのデフォルトのスタイルシートがこれを引き起こしている可能性があります。簡単な修正である必要があります。

于 2013-03-26T03:45:08.880 に答える