Tailwind CSS для index.html файла

15 июля 2025 г.

Tailwind CSS — это популярный CSS-фреймворк, который позволяет быстро создавать адаптивные и стилизованные интерфейсы.

Чтобы подключить Tailwind CSS к вашей HTML-странице без использования сборки, добавьте в секцию следующий код:

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://unpkg.com/@tailwindcss/browser@4"></script>

После этого вы можете использовать классы Tailwind CSS в вашем HTML-коде.

Пример использования

<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="https://unpkg.com/@tailwindcss/browser@4"></script>
  </head>
  <body>
    <div
      class="bg-blue-500 text-white px-6 m-4 py-4 h-36 rounded-lg flex flex-col justify-end items-start"
    >
      <span class="text-3xl font-bold">Привет, Tailwind CSS!</span>
      <span class="">Это пример использования Tailwind CSS без сборки.</span>
    </div>
  </body>
</html>
index.html
Привет, Tailwind CSS!Это пример использования Tailwind CSS без сборки.
Подпишитесь на мой Бусти, чтобы комментировать записи и получать уведомления о новых заметках.Подписаться на Бусти
Показать заметки по похожей теме