CSS

how to install tailwind css in html

    
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
    

install tailwind css

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init

tailwind css installation

   				  /*Follow the commands for Tailwind CLI*/
1. Initialize a node project in your directory:
           npm init -y
           
2. Install tailwindcss as a devDependency: 
           npm i -D tailwindcss
           
3. Install vs code plugin: Tailwind CSS IntelliSense (not for terminal)

4. Create a configuration file for tailwindcss: 
           npx tailwindcss init
           
5. Create src and output folder in root.

6. In src folder create a file named tailwind.css / (anyname).css

7. In src/tailwind.css write these : 
           @tailwind base;
           @tailwind components;
           @tailwind utilities
8. Create a folder named .vscode and ini this folder create a file 
   named settings.json. 
   
9. And paste this: 
           {
           	 "css.validate": false, 
             "tailwindCSS.emmetCompletions": true
           }
  this setting will help to not get erron after writing css

10. In scritps property in package.json file write a build property:

  "scripts": 
      "build": "tailwindcss -i ./src/tailwind.css -o ./output/tailwind.css -w"
      
11. Link tailwind in HTML like this href="./output/tailwind.css"

12. Now build tailwind: 
			npm run build 

13. Now you just have on task to complete which is content configuration: 
    See the configuration from here: 
         https://tailwindcss.com/docs/content-configuration

installation tailwind css in html

npx tailwindcss -i style.css -o tailwind.css