提示框
五種原生類型
擴充套件將 Quarto 原生類型對應至固定的視覺意義:note 使用柔和藍色與資訊圖示,tip 使用藍綠色與火焰圖示,important 使用薰衣草紫與警示圓形圖示,warning 使用琥珀色與三角形警示圖示,caution 使用珊瑚色與八角形警示圖示。圖示是本機隨附的 Lucide SVG,透過 CSS 遮罩呈現,不需新增執行環境。
在 Quarto DOM 容許的範圍內,外框、標題、語意化透明邊框與填色、5px 圓角、圖示和箭頭都盡量貼近 Quartz 的提示框範例。Quarto 的五種原生類型、收合行為與巢狀提示框就是目前的介面;此處不另行創造 Quartz 的其他類型與別名。
若要在較寬螢幕並排呈現兩個提示框,請使用 .askr-grid。圖形頁的響應式群組範例說明斷點並展示一組提示框。
五種提示框
註釋說明
使用說明提示提供背景資訊,但不打斷主要脈絡。
提示提示
使用提示提供實用做法。無論巢狀深度為何,圖示都維持火焰。
重要重要
使用重要提示標示會影響讀者決策的資訊。
警告警告
若讀者應先檢查某個條件再繼續,請使用警告。
注意注意
若有具體風險,且其後果應持續清楚可見,請使用注意提示。
邊界案例
註釋這段刻意較長的原生自訂標題,在窄版手機上會自然換行,而不會改變提示框類型
較長的自訂標題仍屬於原生標題列。
警告已收合的原生警告
可透過 Quarto 原生展開控制查看本文。Askr 只替換箭頭圖樣,並讓控制項與標題置中對齊。
巢狀提示框
提示先協助讀者掌握方向
藍綠色的外層提供實用導讀。
重要保留決策界線
薰衣草紫的內層承載重要條件,不會沿用外層的藍綠色。
限制
主題在頁面不變寬的情況下,容納較長的原生標題與巢狀提示框。請勿在單一提示框中放入表格、圖形與多段文字;將這些內容移到文章本文,讓提示框只負責呈現警告。