文章樣式指南(大標題 h2=文章標題)

本頁為文章排版的樣式指南。實際發布消息時,請直接改寫本頁的內容,並移除 <article> 的 data-styleguide 屬性。以下列出可使用的樣式。

中標題(h3):墨筆風底線背景

中標題會在下緣鋪上墨筆筆觸的背景圖,與和紙質感的底色相襯。

小標題(h4)

小標題採用左側直線的簡潔樣式,用於長篇文章的層次區分。

■ 圖片與影音

一般圖片 / 附說明文字的圖片

一般圖片(<img>)會配合文章寬度顯示。需要說明文字時,使用 <figure> 搭配 <figcaption>。

圖片範例
圖1:附說明文字的圖片顯示範例(figcaption)

YouTube 嵌入(16:9 自動縮放)

■ 文字裝飾

文字大小 / 粗體 / 強調

這是一般大小的內文。放大的文字(tsize-l),接著是 特大的文字(tsize-ll)。需要強調的部分使用粗體 strong,更重要的部分使用紅色粗體 em。

文字顏色(5 色)

紅色(red) 藍色(blue) 綠色(green) 橘色(orange) 紫色(purple)

螢光筆(6 色)

螢光筆 紅 螢光筆 藍 螢光筆 黃 螢光筆 橘 螢光筆 綠 螢光筆 紫

文字底色(2 色)

文字底色 黃(t-bg1) / 文字底色 水藍(t-bg2)

■ 清單

項目符號 / 打勾符號 / 編號

項目符號(ul)

  • Nintendo Switch™ 2 版
  • Nintendo Switch™ 版
  • PlayStation®5 版
  • Steam® 版

打勾符號(checkmark)

  • 加入願望清單
  • 確認最新資訊
  • 追蹤官方社群

編號(ol)

  1. 第一個步驟
  2. 第二個步驟
  3. 第三個步驟
■ 方框

白底方框 / 加框白底方框

白底方框(box):用於整理注意事項或補充資訊。

加框白底方框(box-frame):需要更明確區隔時使用。

■ 表格

表格(table)

項目內容
遊戲名稱朧村正怪奇譚
遊戲類型絢爛繪卷和風動作RPG
遊玩人數1人
對應機種Nintendo Switch™2 / Nintendo Switch™ / PlayStation®5 / Steam®
■ 其他

文字連結 / 連結按鈕 / 分隔線

內文中的連結像這樣(text-link)顯示,平時為淺色底線,滑鼠移入時底線由左向右加深。

前往官方網站


分隔線(hr)下方的文字範例。