標籤: tailwindcss 頁1

教學

[Tailwind CSS] 響應式設計(Responsive Design)

說明使用 Tailwind CSS 設定響應式設計的方法。

教學

[Tailwind CSS] 使用 Grid 來排列 RWD 版型

說明使用 Tailwind CSS 來排版並製作 RWD 的方法。

教學

[Tailwind CSS] 設定 h1~h6 等標籤的文字大小

Tailwind CSS 在初始化後會把 h1~h6 的大小都變成預設瀏覽器文字大小,如果要設定各個標題標籤的大小的話就要在 app.css 的時候調整初始化設定。

教學

[Tailwind CSS] 使用 Aspect Ratio 設置固定比例區塊

在 Tailwind CSS 如果我們要設置一個固定比例的區塊,可以使用他們提供的 Aspect Ratio 的 class。

教學

在 Laravel 專案使用 Tailwind CSS 和 Font Awesome

說明如何在 Laravel 專案使用 Tailwind CSS 和 Font Awesome。

教學

[Tailwind CSS] 自訂元件(component)

說明透過 @apply 的方式來自製以 Tailwind CSS 為基礎的元件(component)。

教學

[Tailwind CSS] 設定 container

Tailwind CSS 利用 container 這個 class 來設定內容的最大寬度不要延伸到整個頁面,一般建議切版最外層都要加上 container 這個 class 會比較好。

教學

在 Laravel 安裝 tailwindcss

tailwindcss 是近年流行的 CSS 框架,如果要在 Laravel 上使用的話可以依據以下步驟。

網路資源

Tailwind CSS- Utility-First CSS 的 CSS 框架

Tailwind CSS 是一個近年崛起的 CSS 框架,不同以往使用框架只是 class name 的搭配組合,Tailwind CSS 還提供你利用內建的樣式產出新的模組的功能,對於開發者來說又更有彈性了,從事前端開發的朋友都應該花點時間試試看他的威力。

教學

tailwindcss 安裝教學

介紹一下該怎麼使用 parcel.js 來幫助我們安裝 tailwindcss 的環境。