Run
Tutorial With Example
Run your live code
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Example of CSS ::before and ::after Pseudo-element</title> <style> h1::before { content: url("/assets/example-image/flower.jpg"); } h1::after { content: url("/assets/example-image/flower.jpg"); } </style> </head> <body> <h1>The ::before and ::after Pseudo-element</h1> <p>You can utilize the ::before and ::after pseudo-elements to insert generated content either before or after the content of an element. In addition, you can use the content CSS property in conjunction with these pseudo-elements for inserting the generated content.</p> </body> </html>