How you put CSS tag in the question I’ll give you an answer only with CSS.
All the content you put inside one content:
of a pseudo-element is rendered as text and not as code, because it is a content that does not exist in the DOM of HTML, it is built in CSS.
Look at the example and I checkbox
.
input:checked + div::after {
content: "<h1>minha tag</h1>"
}
<input type="checkbox" name="" id="">exibir tag
<div></div>
Option 2
You can also write your HTML directly in one custom attribute direct on the tag (ex: <div data-html="<h1>meu h1</h1>">
), then you can use a pseudo element with content:attr(data-html)
to take what is in data-html=""
and put on the screen.
input:checked + div::after {
content: attr(data-html);
}
<input type="checkbox" name="" id="">exibir tag
<div data-html="<h1>meu h1</h1>"></div>
OBS1: I made this example as simple as possible for educational purposes only
OBS2: The drawback of this technique is that as the text is not in the DOM vc can not select it to for example give a Ctrl+C / Ctrl + V
Is that it? https://answall.com/q/49756/112052
– hkotsubo
Perhaps the Itasouza’s answer will solve the problem. However, I believe it is duplicated from: https://answall.com/questions/59934/como-scri-c%C3%B3digos-as-example-without-run
– RXSD
Here in the forum, the questions are negative when they are very simple or for several other reasons, for you who are starting, maybe it is good to have more query options, before asking a question
– Harry