Tailwind HTML Starter Template
Ahmad Awais
Follow on Twitter @MrAhmadAwais
An HTML Starter Template for Tailwind CSS. You need an HTML5 doctype and a responsive viewport meta tag.
Tailwind CSS works best when you use an HTML5 doctype and include the responsive viewport meta tag required to handle correct responsive behavior on different devices.
- HTML5 doctype
<!doctype html> - Responsive viewport meta tag
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
Overall your HTML page structure should look like the following:
<!doctype html><html><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link href="/path/to/tailwind.css" rel="stylesheet"> <!-- ... --></head><body> <!-- ... --></body></html>Many frameworks like Next.js or the Vue-CLI — take care of this automatically. So, this template should come in handy if you need it depending upon what you are using to build your web application.
Ahmad Awais
Follow on Twitter @MrAhmadAwais