Как использовать CSS для замены или изменения текста?

Как заменить "Закладки" на "Ссылки" с помощью CSS?

<div class="lfr-panel-title"> 
  <span> Bookmarks </span> 
</div>

Я знаю, что CSS не был предназначен для этого, но есть ли кросс-браузерный способ?

Ответы

Ответ 1

Вы могли бы сделать что-то сумасшедшее, как это.

живая демонстрация

.lfr-panel-title span{
   display:none;
}

.lfr-panel-title:after{
   content: "links";   
}​

Но, как все указывают, его не рекомендуется.

Ответ 2

CSS не изменяет или не заменяет точный текст.

Для этого вам нужно использовать какой-то клиентский язык (JavaScript, jQuery и т.д.) или серверный язык (php, ASP.NET и т.д.).

Как @Loktar утверждает, вы можете имитировать эту функцию с помощью псевдоселекторов :before и :after.

Хотя, это не рекомендуется для этого использования, и он не полностью совместим с несколькими браузерами при учете IE. Посмотрите диаграмму совместимости кросс-браузера с помощью QuirksMode:

:before :after cross-browser chart

Ответ 3

Короткий ответ: нет.

Длинный ответ: CSS не предназначен или очень способен манипулировать контентом. Вы можете заменить текст, используя фоновое изображение, но это не очень доступно. Различные методы: после или: до этого также не были бы совместимы с несколькими браузерами.

Вам понадобится javascript для управления контентом таким образом.