::before Back

• ::before is a generated content element that represents a styleable abstract first child of the respective element.
• The content inserted using ::before is inserted before other content inside the element and is displayed inline by default. The value of the content is specified using the content property.

Case : add a quote before a block quote

<blockquote>
    Your present circumstances don't determine where you can go; they merely determine where you start.—Nido Qubein
</blockquote>

blockquote::before {
    content: "\201C"; /** style of the quote */
    color: deepPink;
    font-size: 3em;
    position: relative;
    top: 20px;
}

See the Pen dGVYYB by aleen42 (@aleen42) on CodePen.