Как сделать такую расшифровку марки?

Question

[Just_Andrew]

Добрый день! Собственно вопрос в том как лучше сверстать такое! Понятно дело, что можно вставить картинку и не заморачиватся, но мне очень интересно почитать как это сделать другими способами если это возможно!
Верстка должна быть адаптивна!

Comments

[Zhainar]

ооочень не удобная схема, подумайте лучше как ее улучшить

[Just_Andrew]

Буду рад если дадите совет для улучшения данной схемы

[Zhainar]

Just_Andrew: сделать просто списко, а при наведении на кусочек структуры подсвечивался бы соответствующий элемент списка с описанием, и наоборот. Читать очень сложно, дизайнеру двойка.

[Just_Andrew]

Zhainar: Интересное решение, спасибо!

Answer 1

[Сергей Тутуков]

Думаю ты полдня убьешь, чтобы такое сверстать адаптивно.
Конечно это не то что на картинке, но зато быстро, понятно и адаптивно tooltip.

Comments

[Just_Andrew]

Идея отличная! Спасибо, если не найду что-то более интересное, сделаю по вашему совету!

Answer 2

[Максим Люмен]

обычные теги + @media
или за вас надо сверстать ? покажите что вы сделали

Comments

[Just_Andrew]

Я пока еще ничего не делал, верстать за себя я не прошу, я лишь хочу получить советы по поводу какой оптимальный способ можно применить!