listing & code

ArbNet
На сайте с 27.10.2019
Offline
125
260

Сделал подсветку синтаксиса, которая может преобразовывать код, в код с подсветкой, как просто статично на странице, так и в визуальном редакторе.

В HTML есть два тега listing и  code оба предназначены для вывода кода программ. В чём их разница не понятно, listing применяется для многострочного кода, code для однострочного, но можно и для многострочного.

Хочу сделать некий стандарт(свой). Для listing сделать стилизацию как для многострочной подсветки с нумерацией строк как в IDE. Для code сделать так чтобы можно было вставлять небольшие вставки кода прямо в тексте однострочно.

Просто ещё есть нюанс, listing я настроил чтобы можно было в тексте вставлять части кода с некоторой стилизацией. А для визуального редактора стилизация такая не нужна, хотя можно для редактора свой класс сделать. Сейчас использую в редакторе code, но по идее напрашивается listing.

Короче вот думаю как лучше сделать, чтобы был некий свой стандарт.

Обсуждение разработки на моём фреймворке https://discord.gg/23N4s9x2kp
W1
На сайте с 22.01.2021
Online
286
#1
ArbNet :
В чём их разница не понятно
listing считается устаревшим. А code не учитывает переносов строк. Но его можно обернуть в <pre>, и переносы отобразятся.  
Мой форум - https://webinfo.guru –Там я всегда на связи
ArbNet
На сайте с 27.10.2019
Offline
125
#2
webinfo #:
listing считается устаревшим. А code не учитывает переносов строк. Но его можно обернуть в <pre>, и переносы отобразятся.  

Это понятно. Но думаю ещё не скоро устаревшие теги браузеры перестанут поддерживать.

Поэтому думаю сделать некую стилизацию для некоторых тегов чтобы при создании страниц не заморачиваться, что и как лучше сделать. Просто прописываешь тег и что в его записи будет оформляться как надо. Код ведь требуется вставлять и в тексте в абзаце к примеру и просто в блоке в статье, а ещё я в визуальном редакторе сделал. Короче напрашивается пока некоторая систематизация.

В будущем если какие либо теги перестанут поддерживаться, то найду другие решения, а пока вот так думаю сделать. Чтобы пользователи не задумывались над оформлением и прочим, указывали нужный тег и получали нужный результат: listing для многострочного кода, code для однострочного в тексте например. Хотя разумнее наверно сделать наоборот: listing для одной строки, а code для многострочного кода. В случае если listing уберут найти другое решение для однострочного кода. Или всё же глядя в будущее настроить только один тег code для однострочного и многострочного кода?

ЗЫ. Вопрос пустяковый, но вот когда куча разных решений возникает не знаешь к какому решению лучше склонятся.

V
На сайте с 16.12.2010
Offline
132
#3
Зачем светить на синтаксис?
ArbNet
На сайте с 27.10.2019
Offline
125
#4
Vistaa #:
Зачем светить на синтаксис?

Для удобства как в IDE

Вот ещё тег figure хочу использовать как контейнер группировки и позиционирования элементов, для образца, того же кода и др. при оформлении статей и др.

LEOnidUKG
На сайте с 25.11.2006
Offline
1725
#5

https://developer.mozilla.org/en-US/docs/Web/HTML/Element

Нет никакого  listing уже давно.

Судя по http://htmlbook.ru/html/listing он умер ещё в HTML 4, браузеры как какой-то очень сильный легаси его тянут.

HTML elements reference - HTML: HyperText Markup Language | MDN
HTML elements reference - HTML: HyperText Markup Language | MDN
  • 2023.03.09
  • developer.mozilla.org
They are grouped by function to help you find what you have in mind easily. An alphabetical list of all elements is provided in the sidebar on every element's page as well as this one. Document metadata Metadata contains information about the page. This includes information about styles, scripts and data to help software (search engines...
✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/
ArbNet
На сайте с 27.10.2019
Offline
125
#6
LEOnidUKG #:
Нет никакого  listing уже давно.

Понятно, спасибо, значит буду использовать только code.

lutskboy
На сайте с 22.11.2013
Offline
172
#7
выложите код. затестим

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий