Text values for list-style-type CSS property, how?

To my knowledge, it's not possible to do that using the list-style-type property.

However, if your browser supports the :before CSS selector, you can use it to insert the bullet entities before the list items. You only need to convert the entity code to hexadecimal:

ul {
    list-style-type: none;
}

li:before {
    content: "\25ba\00a0";
}

You can find a jsFiddle demonstrating this here.


@Frederic shows an interesting workaround that I would go with, unless you have to support IE6 and 7 - in that case, you'd have to work around with a normal HTML element that contains the character, and that you style to put it into the right place.

Something like

ul { list-style-type: none } /* Adjust margin and padding as you see fit */
ul li div.bullet { float: left; width: 30px; margin-right: 12px }

<li>
 <div class="bullet">&#9658;</div>
 List item 1
</li>

If you use the :before method to get your list-style think about adding a padding to the list and a negative margin to the list-element to get the same space at line-break:

ul {
    list-style: none;
    padding: 0 0 0 24px
}
ul > li:before {
    content: '\25BA';
    float: left;
    margin-left: -24px
}

Just use the example postet from thirtydot to try in jsfiddle