CSS для замены символов в теге абзаца

Question

Уже проверил существующие вопросы для этого, но не нашел точного соответствия.

Моя цель - заменить символы (например, пробелы) на веб-странице небольшим изображением с помощью css.

Пример:

<p><span>This is a text</span></p>

становится:

<p><span>ThisIMGisIMGaIMGtext</span></p>

(где IMG обозначает видимое изображение (middot-pic для пробела, например,))

Я не могу вспомнить подходящий селектор CSS. Но, может быть, один из вас, ребята (или девушки), знает решение. Возможно ли это вообще?

Answer 1

Поскольку у вас нет идентификатора, я предполагаю, что вы хотите его получить на всех <p><span>...</span></p>. JQuery поможет вам:

$(document).ready(function(){ 
  $("p span").html($("p span").html().replace(/ /g,'<img src="yourimg.gif" />'));
});

Answer 2

Нет, у CSS нет этой способности. Единственное, что он может делать, - это преобразование текста, которое может делать такие вещи, как сделать его прописными.

Answer 3

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