<!DOCTYPE html>
<html>
<head>
<style>
h2 {
counter-increment: h2;
display: list-item;
}
h2::marker {
display: list-item;
content: "@" counter(h2) " ";
color: lightgreen;
}
body {
counter-reset: h2;
font-family: verdana;
margin: 50px;
}
</style>
</head>
<body>
<h1>Demo of ::marker</h1>
<h2>Learn HTML</h2>
<p>The first thing you have to learn, is HTML, which is the standard markup language for creating web pages.</p>
<h2>Learn CSS</h2>
<p>The next step is to learn CSS, to set the layout of your web page with beautiful colors, fonts, and much more.</p>
<h2>Learn JavaScript</h2>
<p>After studying HTML and CSS, you should learn JavaScript to create dynamic and interactive web pages for your users.</p>
</body>
</html>