Hello, my gorgeous friends on the internet π, In this article, I gathered some unusual HTML tags and their use-cases that can someday save you from writing a bunch of JavaScript and CSS codes, below are the 7 rare HTML tags you should know ππππ ...

Markdown supported Β· ββ΅ to post
great article π. I would like to add to this with the template tag. This is used to hold content that would not be rendered immediately when the webpage is loaded but is displayed with the use of javascript.
For Example:
<!-- code above --> <div> <button id="show-btn">Show hidden </button> <template> <h1> Here there i am a template </h1> <p> You can only display me with javascript </p> </template> </div> <script> const showBtn = document.querySelector("#show-btn") const showHiddenContent = (event) => { const template = document.querySelector("template") const templateClone = template.content.cloneNode(true) event.currentTarget.parentNode.append(templateClone) } showBtn.addEventListener("click", showHiddenContent) </script>You can test this out and see what happens .I recently discovered this one from this video by web dev simplified you can check out his youtube channel he makes great content like this and subcribe to his channel if you found the video helpful (I watch youtube a lot π ). There is also documentation on this on MDN web docs.