Tailwind CSS - 字型樣式

Tailwind CSS 字型樣式 透過使用預定義的類輕鬆地為網頁上的文字設定樣式，確保其在整個網站上都顯得美觀。

Tailwind CSS 字型樣式類

下面列出了指定不同字型樣式的 Tailwind CSS 類。

類	CSS 屬性
italic	font-style: italic;
non-italic	font-style: normal;

Tailwind CSS 字型樣式類的功能

italic: 此類將斜體樣式應用於文字，使其呈現傾斜外觀。
non-italic: 此類會移除文字的斜體樣式，確保其顯示為直立。

Tailwind CSS 字型樣式類示例

以下是 Tailwind CSS 字型樣式類的示例，您可以輕鬆地將不同的文字格式選項應用於這些類，以控制網頁上文字的外觀。

用於斜體和非斜體字型樣式的 Tailwind CSS

此示例展示瞭如何使用 Tailwind CSS 透過預定義的類為段落設定斜體和非斜體字型樣式。

<!DOCTYPE html>
<html lang="en">
<head>    
    <script src="https://cdn.tailwindcss.com"></script>
</head>

<body class="p-4">
    <h1 class="text-2xl font-bold">
        Tailwind CSS Font Style
    </h1>
    <p class="underline">Using Italic</p> 
    
    <p class="italic">
        This text is styled as italic.
    </p>

    <br>
    <p class="underline">Not using italic style</p>
    <p class="not-italic">
        This text is styled as not italic.
    </p>
</body>

</html>

列印頁面