<!DOCTYPE html>
<
html
>
<
head
>
<
style
>
.svg-demo {
text-align: center;
font-weight: bold;
font-size: 20px;
}
.text {
text-align: center;
}
/* Using the :before pseudo-element
to add the SVG content */
.svg-demo:before {
/* Using the content property to
set the background image */
content: url('gfg_logo.svg');
/* Using the zoom property to
control the size of the SVG */
zoom: 25%;
}
/* Using the :after pseudo-element
to add the SVG content */
.svg-demo:after {
/* Using the content property to
set the background image */
content: url('gfg_logo.svg');
/* Using the zoom property to control
the size of the SVG */
zoom: 25%;
}
</
style
>
</
head
>
<
body
>
<
p
class
=
"svg-demo"
>
This is the normal content
</
p
>
<
p
class
=
"text"
>
The SVG images are added before
and after the line using :before
and :after pseudo-elements
</
p
>
</
body
>
</
html
>