How to put a scribble on the page

Asked

Viewed 43 times

0

How to put an orange scribble as in the image below in the html page?

inserir a descrição da imagem aqui

html css css3

  • the easiest would be to have this doodle as picture .png and in the text element you put the property background:url('nome_da_imagem.png')

1 answer

1

You can use as a backgroun-image for the text. type in this example

h1 {
    background-image: url(https://ubisafe.org/images/svg-stroke-brush-2.png);
    background-size: 100% 100%;
    color: aliceblue;
    display: inline-block;
    padding: 1em;
}
<h1>
    Lorem, ipsum dolor.
</h1>
<br>
<h1>
    Lorem, ipsum dolor. Lorem, ipsum dolor.
</h1>

I state that you use a SVG as an image, so it can be better manipulated by CSS and has a better resolution for any size

  • 1

    That’s what I wanted, thanks for the tip Hugo!

Browser other questions tagged html css css3

You are not signed in. Login or sign up in order to post.