Есть ли свойство шрифта или CSS, которое даст каждому персонажу такую же ширину без необходимости рисовать их самостоятельно (.ttf)?
Создание каждого символа на веб-странице одинаковой ширины
Ответ 1
Как насчет Courier New? MONOSPACE?
Ответ 2
CSS
font-family: monospace;
HTML:
<tt>
Ответ 3
Вы можете выбрать любой из свободно доступных шрифтов с фиксированной шириной и внедрить их на свой сайт.
Если вы не хотите вставлять шрифт на свою страницу, вы можете использовать следующее, чтобы использовать шрифт monospace (другой термин для фиксированной ширины):
font-family: "Courier New", Courier, monospace;
Ответ 4
В некоторых случаях использование тега pre (<pre>text</pre>) может заполнить ваши потребности в тексте с моноширинной (фиксированной шириной). Он работал у меня с HTML5 + Chrome (текущая версия). Элемент tt устарел.
Однако, как представляется, тег <pre> может содержать только те теги, которые считаются " фразированным контентом". См. Раздел < Модель содержимого "в w3 документации для этого тега. Вы можете щелкнуть ссылку, чтобы увидеть, какие элементы считаются" фразированным контентом". Конечно, каждый браузер может поддерживать более свободную версию спецификации, если вам не нужна правильная совместимость с HTML или кросс-браузером.
Ответ 5
Существует несколько моноширинных шрифтов, которые дают равную ширину каждому символу. Курьер и курьер New, вероятно, являются наиболее распространенными и должны быть доступны практически во всех системах.
Ответ 6
Другим вариантом было бы использовать lettering.js, который создавал бы элемент span вокруг каждой буквы, после чего вы могли бы установить ширину с помощью CSS. Это, вероятно, было бы целесообразно только для небольших текстов.