Как я могу использовать реляционный отступ с предварительным тегом в html без javascript?

Question

Я написал это html

<div>
  ...something...
  <div>
    <pre>
    abc{
      efg
    }
    <pre>
  </div>
</div>

и браузер покажет мне это как содержимое pre (абсолютный отступ).

    abc{
      efg
    }

но я хочу вот что (реляционный отступ из предварительного тега)

abc{
  efg
}

Меня обыскали в Google, и кто-то решил эту проблему с небольшим кодом javascript.
Но я хочу решить эту проблему без js, если это возможно.
Как использовать реляционный отступ без javascript?

У меня также точно такая же проблема с литералом шаблона js.
код

text = `
       abc
         def
       `

что я хочу

abc
  def

Я действительно получил

       abc
         def

Есть ли способ использовать реляционный отступ или символ отступа, например перевод строки?

Answer 1

Причиной этого являются вкладки или пробелы в файле HTML.

Ваша IDE может форматировать ваш HTML для вас и, как правило, HTML игнорирует пробел, но предварительные теги имеют вид WYSIWYG.

Решение:

<code><div>
  <div>
    <pre>
abc
  def
    

Это ужасно, и вам, возможно, придется настроить свою среду IDE, чтобы прекратить форматировать HTML для вас , но это не javascript решение.