Тонкости работы css.content

Задача: размещаю легенду в виде пар "термин":"значение". На форме это выглядит так:

<table class="legend-table">
<tr><td>Destination</td><td>адрес подсети или хоста назначения</td></tr>
<tr><td>Gateway</td><td>адрес шлюза, через который данный маршрут доступен</td></tr>
...
</table>

Далее, хочу сделать так, чтобы перед каждой расшифровкой значения шло тире - – | – | –. Чтобы вставить просто минус, использую стиль:

table.legend-table tr td:last-child:before {
    content: " - "
}

Но хочется, чтобы это было именно тире. Я сделал промежуточный вариант, вставив символ тире в код, благо исходник в UTF-8 и проблемы нет:

table.legend-table tr td:last-child:before {
    content: " – "
}

Но мне хотелось знать, есть ли нормальный вариант вставить HTML-код перед элементом посредством CSS (то есть – или –)

В идеале было бы найти способ вообще вставки чего угодно перед элементом, например иконки или глифа, или еще чего средствами CSS