How to put &raquo and &laquo in :before?

Question

I need to put one » &raquo and a « &laquo in the attribute :before of a given, element.

How do I do this in CSS?

ul.breadcumb > li:after{
    content: '&raquo'; /** Isso aqui não funciona **/
}

Answer 1

You can use hexadecimal code. &xxxx codes are HTML entities and not CSS, you must use alternative code.

ul.breadcumb > li:after{
    content: '\00BB'; /** Isso aqui funciona **/
}

<ul class="breadcumb">
    <li>teste</li>
    <li>teste</li>
    <li>teste</li>
    <li>teste</li>
    <li>teste</li>
</ul>

Answer 2

You can do this using: \00BB. For example:

ul.breadcumb > li:after{
    content: "\00BB";
}

<ul class="breadcumb">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
</ul>

If you want the arrow to be pointed at the left, uses: \00AB

_{Source: Unicode Character 'RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK'
Source: Unicode Character 'LEFT-POINTING DOUBLE ANGLE QUOTATION MARK'}