;-)

Изменение текста в HTML средствами CSS

HTML и CSSXSLTJavaScriptИзображенияСофтEtc
Владимир Токмаков

14 октября 2005


Для просмотра этого примера необходим IE.

Задача.

Эмулировать CSS-свойство content в IE.

Используем встроенную в IE инструкцию expression.

Как это выглядит в браузере

  • пункт®
  • — в этом пункте уже было тире
  • но вот в таком случае — будет проблема

01 
02 
03 
04 
05 
06 
07 
08 
09 
10 
11 
12 
13 
14 
15 
16 
17 
<style type="text/css">
    ul.example { margin: 0.5em 0; padding: 0 0 0 2em; }
    ul.example li
    {
        margin: 0.5em 0; padding: 0 0 0 20px;
        list-style-type: none;
        behavior: expression( !this.before
            ? this.before = this.innerHTML = '&mdash;&nbsp;' + this.innerHTML : '' );
        text-indent: -1.24em;
    }
    ul.example li:before { content: '\2014\a0'; }
</style>
<ul class="example">
    <li>пункт<sup>&reg;</sup></li>
    <li> &mdash; в&nbsp;этом пункте уже было тире</li>
    <li><p>но вот в&nbsp;таком случае&nbsp;&mdash; будет проблема</p></li>
</ul>