HTML <template> Tag


The HTML <template> tag is a versatile element used to define client-side content that should not be rendered when the page loads but can be instantiated and displayed later through JavaScript. It serves as a container for holding HTML content, such as elements, text, or other markup, which can then be cloned and inserted into the document as needed. This feature is particularly useful for creating reusable components, dynamic content generation, or improving page load performance by deferring the rendering of certain elements until they are required, reducing initial page rendering time. The content within a <template> tag remains inert until explicitly activated, making it a valuable tool for modern web development.


Permitted Parents
Any element that accepts metadata content, phrasing content, or script-supporting elements. Also allowed as a child of a <colgroup> element that does not have a span attribute.
No restrictions
Start/End Tags
Start tag: required, End tag: required


<table id="producttable">
<!-- existing data could optionally be included here -->

<template id="productrow">
<td class="record"></td>



Global Attributes

The <template> tag also supports the Global Attributes in HTML5

Event Attributes


Browser Support

The following table will show you the current browser support for the HTML <template> tag.

Edge Chrome Firefox Opera Safari
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview

Last updated by CSSPortal on: 30th September 2023