排版元素示範:標題、清單、程式碼與表格

發表於 字數總計:396 閱讀時長:2 分鐘

這篇把常用的排版元素都放一次,方便你確認每種格式在這個主題底下長什麼樣。

標題層級

H2 是段落的主要分隔。把滑鼠移到標題上,右邊會出現錨點連結,點了就能複製這一段的網址。H3 沒有裝飾,用字級和粗細區分。右側的文章目錄只會抓 H2 和 H3。

這是一個 H3

H3 底下的說明文字。段落行高設在 1.85,中文閱讀起來比較不擠。

清單

項目符號的顏色會跟著主色走:

  • 無序清單第一項,前面是藍色圓點
  • 第二項,可以放粗體或斜體
  • 第三項,也可以放連結,連結是藍色的
  1. 有序清單也一樣
  2. 數字同樣是藍色

引言

引言區塊有淡灰底色和左邊的藍色粗線,適合放重點或引用別人的話。

程式碼

行內程式碼像這樣:wp_enqueue_style(),是藍字配淡藍底。

整段程式碼會變成一個 macOS 視窗:左上角紅黃綠三個圓點、中間是語言名稱、右邊有拷貝按鈕,程式碼本身有行號和語法上色。超過 14 行的區塊會自動收合,點下方的按鈕就能展開。

function hello() {
    echo "Hello, dadiblog!";
}

表格

項目 說明 預設值
主色 整站的強調色 #0071E3
圓角 卡片的圓角半徑 28px
版面寬度 內容加側邊欄的最大寬度 1120px

分隔線


以上就是全部的基本元素。這篇同樣是示範,可以刪。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *