Как оформить блок с кодом?

Question

Сам я еще новичек в вебе, пришла идея создать сайт(не важно что там будет), где будут вставки с кодом, вот пример того, что я сделал: но дело в том, что хоть это(как мне кажется) выглядет еще более менее, то вот код оставляет желать лучшего(ничего остроумнее я не придумал кроме как просто создать по одному<span> для каждого цвета в синтаксисе и как вы понимаете выглядет это абсолютно нечитабельно(вот пример, таже показывать стыдно такой код)):

Хотел бы узнать нет ли более разумного решения для того чтобы оформить блок с кодом?!

Answer 1

Если не ошибаюсь, то для этого используется тег <code>.

Вот простой пример:

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег CODE</title>
 </head>  
 <body> 

  <p>Код программы</p>
  <p><code>
    function checkParent (src, dest) {<Br>
     while (src != null) {<Br>
       if (src.tagName == dest) return src<Br>
        src = src.parentElement<Br>
     }<Br>
     return null<Br>
    }</code></p>

 </body>
</html>

Подробнее тут.

Ну а что касается цвета, то это только через css, либо как вариант поискать сайт, который позволяет сразу же преобразовать подсветку синтаксиса в соответствии с нужным вам ЯП и выводит это в готовые html и css.

БЛОГ НА HUSL

Как оформить блок с кодом?

Ответы (1 шт):