Идеально: я хотел бы начать с семантически правильного кода в HTML5 (основной, который содержит статьи, разбитые на разделы), где содержимое страницы хорошо структурировано, а затем построить интерфейс вокруг него без использования каких-либо классов / идентификаторов CSS или любые встроенные таблицы стилей.
Идеальная цель: иметь весь код в чистом HTML, отформатированный и представленный только с использованием CSS из внешней таблицы стилей, примененной к тегам main, article, section, ul, li, h1 ... etc ...
Страница: http://www.leafytechnologies.it/prodotti/analizzatore-di-cloro/
Задача: мне нужна система отзывчивых горизонтальных вкладок, в которой каждая статья представляет собой горизонтальную вкладку, которая отображается при наведении курсора мыши на вкладку
Я посмотрел огромное количество примеров, и все они включают в себя либо JQuery, Javascript, либо использование переключателей (неправильное использование тегов). Теоретически должно быть идеальное разделение между представлением и содержанием, и это то, чего я пытаюсь достичь
Структура HTML-страницы:
<main>
<article>
This article will be the first tab
</article>
<article>
<section>
This is a section in the second tab
</section>
</article>
</main>
Как вы думаете, возможно ли достичь этого с помощью существующих технологий? Если нет, каково ближайшее решение? Мне бы хотелось, чтобы HTML-код был максимально чистым (без классов, без встроенных) для повторного использования в будущем