Как добавить текст или символы с помощью CSS (без JavaScript)?

Question

Ну, это должно работать в IE, я знаю, что IE не поддерживает свойство содержимого, что-нибудь еще?

Answer 1

Единственным параметром является свойство content:

Свойство content используется с :before и :after псевдоэлементов, до вставить сгенерированный контент.

Но, как вы заметили, это часть CSS 3 и не поддерживается IE. В то же время вам нужно будет компенсировать с помощью JavaScript.

Answer 2

Это вполне возможно решить без Javascript, используя комбинацию HTML и CSS. Хитрость заключается в том, чтобы продублировать контент, добавленный CSS в HTML, в специфический для IE условный комментарий (не показанный другими браузерами) и использовать селектор display CSS для переключения при отображении этого элемента. Согласно MSDN , IE 8+ поддерживает CSS :after и content:, поэтому только IE 7 и ниже должны использовать условный комментарий.

Вот пример:

<style type="test/css" media="screen">
.printonly { display: inline; }
</style>

<style type="text/css" media="print">
#maintitle:after { content:" \2014  Site Title";} /* for IE8+ and Other Browsers. sidenote: Can't use &mdash directly in generated content, so using escape code */
.printonly { display:inline } /* For IE <= 7 */
</style>

<h1 id="maintitle">Page Title 
    <!--[if lte IE 7]><span class="printonly">&mdash; Site Title</span><![endif]-->
</h1>

Answer 3

Вы можете попробовать использовать IE8.js для исправления содержимого, что может помочь. Если нет, то вы ничего не можете сделать, кроме фоновых изображений с текстом

Answer 4

Коротких картинок с текстом - нет.

Answer 5

Единственный способ - JavaScript или CSS3.

Может быть, вы скажете нам, что вам нужно сделать, тогда мы можем помочь.

Почему ты не можешь сделать это с помощью js?