Using tailwind via CDN
<!-- add it to the head section of the html file -->
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
rel="stylesheet">
Using tailwind via CDN
<!-- add it to the head section of the html file -->
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
rel="stylesheet">
Using tailwind via CDN
<!-- Write HTML code here -->
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" />
<meta name="viewport"
content="width=device-width,
initial-scale=1.0" />
<title>Tailwind CSS</title>
<link rel="stylesheet"
href="./style.css" />
</head>
<body>
<!-- font size -->
<h1 class="text-lg">Large font size</h1>
<!-- font weight -->
<h1 class="font-bold">Bold fond weight</h1>
<!-- Typography -->
<h1 class="tracking-widest">Spacing between words</h1>
<!-- Transform -->
<h1 class="uppercase">Uppercase word</h1>
<!-- line height align color background
width padding margin border opacity shadow-->
<div class="leading-9 text-right
text-red-700
bg-red-500 w-1/2 h-1/3 p-5 my-10
border-t-2
border-solid
border-green-500
opacity-40
shadow-2xl">
<p>GeeksforGeeks</p>
</div>
<!-- focus pseudo class -->
<input class="border focus:border-red-500
focus:outline-none p-5 m-5
placeholder-red-500"
type="text"
name=""
value=""
placeholder="name" />
<!-- layout -->
<div class="md:flex md:flex-wrap m-5">
<div class="bg-blue-500
p-5 md:w-1/3
md:bg-pink-600">
GeeksforGeeks
</div>
<div class="bg-teal-500 p-5 md:w-1/3">
GeeksforGeeks
</div>
<div class="bg-yellow-500 p-5 md:w-1/3">
GeeksforGeeks
</div>
</div>
</body>
</html>
cdn for tailwind
Error: PostCSS plugin tailwindcss requires PostCSS 8.
Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us