Как сделать эффект закомментированного текста?

Question

[Maks_Min]

Как сделать подобный эффект?


Текст у меня выводится, а не вписывается вручную, поэтому руками сделать перенос и звездочки не получится. Может уже есть готовые примеры?

Comments

[hesrun]

Это сделано с помощью расширений в IDE. Там пишутся комментарий, потом сочетанием клавиш комментируется блок.
https://marketplace.visualstudio.com/items?itemNam... под VS

[Maks_Min]

мне нужно не в ide это сделать, а на странице. теги вопроса же указаны.

[Сергей delphinpro]

Как обычно: произвести декомпозицию задачи на множество мелких, и каждую мелкую решать по отдельности.

Например так:

1. Получить входную строку.
2. Разбить ее по словам на строки, не превышающие длину Х.
3. В начало каждой строки добавить звездочку.
4. Вывести текст построчно.

В каком пункте возникают затруднения?

[Maks_Min]

Сергей delphinpro, в пункте 2.

[Сергей delphinpro]

Maks_Min,

Разбейте ее на еще более мелкие задачи

Начать цикл
Перейти на позицию Х
Проверить символ
Если пробел – то это граница слова
  Вырезаем подстроку от нуля до этой позиции 
Если не пробел, то перемещаемся влево до ближайшего пробела
  Вырезаем подстроку от нуля до найденной позиции
Добавляем к вырезанной подстроке звездочку в начало и помещаем ее в результирующий буфер (например, массив)
Конец цикла

[Maks_Min]

Сергей delphinpro, проблема в том, что ширина блока не фиксированная, поэтому я и не могу знать сколько текста должно быть в одной строке. есть ли другие варианты?

[Сергей delphinpro]

Maks_Min, Если шрифт моноширинный (а для кода обычно так и есть), то вам нужно лишь узнать ширину одного символа.

Но это как мне кажется излишние сложности. Есть другой путь.
Звездочка в виде картинки высотой равной line-height текста.
А дальше примитивно просто. фон с повторением по вертикали и выравниванием по левому краю.