[Obs＃90] Callouts擴充：CalloutTypesetting CSS Snippet

1. 安裝

1. 由GitHub點擊【Copy raw content】圖示，將內容存入儲存庫資料夾/.obsidian/snippets/CalloutTypesetting.css檔案。
2. 設定→外觀→重新載入CSS Snippets

2. 設定

使用Style Settings外掛設定。

3. 語法

[!TIP] 語法

 > [!Callout類型 | Typesetting]：在標準的Callout中括號裡用Pipe (|)符號增加擴充的CSS類別，可用空白分隔多個擴充類別

4. 使用範例

4.1. ltr 橫排由左到右

[!REF | ltr]+ 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.2. rtl 橫排右靠對齊

[!REF | rtl]+ 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.3. vertical-lr 豎排由左到右

[!REF|vertical-lr]+ 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.4. vertical-rl 豎排由右到左

[!REF|vertical-rl]+ 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.5. vertical-rl + wide 豎排由右到左+寬版

[!REF|vertical-rl wide]+ 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.6. vertic`al-rl+keep-height 豎排由右到左+區塊高度固定

[!REF | vertical-rl keep-height]- 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.7. vertical-lr + upright

[!REF | vertical-lr upright] Poem
When I was one-and-twenty
I heard a wise man say,
“Give crowns and pounds and guineas
But not your heart away;
Give pearls away and rubies
But keep your fancy free.”
But I was one-and-twenty,
No use to talk to me.

When I was one-and-twenty
I heard him say again,
“The heart out of the bosom
Was never given in vain;
’Tis paid with sighs a plenty
And sold for endless rue.”
And I am two-and-twenty,
And oh, ’tis true, ’tis true.
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.8. vertical-lr + sideways

• sideways: 文字轉90度

[!REF | vertical-lr sideways] Poem
When I was one-and-twenty
I heard a wise man say,
“Give crowns and pounds and guineas
But not your heart away;
Give pearls away and rubies
But keep your fancy free.”
But I was one-and-twenty,
No use to talk to me.

When I was one-and-twenty
I heard him say again,
“The heart out of the bosom
Was never given in vain;
’Tis paid with sighs a plenty
And sold for endless rue.”
And I am two-and-twenty,
And oh, ’tis true, ’tis true.

我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.9. vertical-rl + l-align 豎排+左靠

• l-align與r-align只對豎排有效

[!REF | vertical-rl l-align]- 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

4.10. vertical-rl + r-align 豎排+右靠

• 閱讀模式才能看到右靠效果

[!REF | vertical-rl r-align]- 《錯誤》 鄭愁予
我打江南走過
那等在季節裡的容顏如蓮花般開落

東風不來，三月的柳絮不飛
你的心如小小的寂寞的城
恰若青石的街道向晚
跫音不響，三月的春帷不揭
你底心是小小的窗扉緊掩

我達達的馬蹄是美麗的錯誤
我不是歸人，是個過客…

[!REF | vertical-rl r-align]- Poem: 《海燕》 高爾基

在蒼茫的大海上……在高傲地飛翔
在蒼茫的大海上……在高傲地飛翔
在蒼茫的大海上，狂風捲集着烏雲。在烏雲和大海之間，海燕像黑色的閃電，在高傲地飛翔。
一會兒翅膀碰着波浪，一會兒箭一般地直衝向烏雲，它叫喊着，──就在這鳥兒勇敢的叫喊聲裏，烏雲聽出了歡樂。
在這叫喊聲裏──充滿着對暴風雨的渴望！在這叫喊聲裏，烏雲聽出了憤怒的力量、熱情的火焰和勝利的信心。
海鷗在暴風雨來臨之前呻吟着，──呻吟着，它們在大海上飛竄，想把自己對暴風雨的恐懼，掩藏到大海深處。
海鴨也在呻吟着，──它們這些海鴨啊，享受不了生活的戰鬥的歡樂：轟隆隆的雷聲就把它們嚇壞了。
蠢笨的企鵝，膽怯地把肥胖的身體躲藏到懸崖底下……只有那高傲的海燕，勇敢地，自由自在地，在泛起白沫的大海上飛翔！
烏雲越來越暗，越來越低，向海面直壓下來，而波浪一邊歌唱，一邊衝向高空，去迎接那雷聲。
雷聲轟響。波浪在憤怒的飛沫中呼叫，跟狂風爭鳴。看吧，狂風緊緊抱起一層層巨浪，惡狠狠地把它們甩到懸崖上，把這些大塊的翡翠摔成塵霧和碎末。
海燕叫喊着，飛翔着，像黑色的閃電，箭一般地穿過烏雲，翅膀掠起波浪的飛沫。
看吧，它飛舞着，像個精靈，──高傲的、黑色的暴風雨的精靈，——它在大笑，它又在號叫……它笑那些烏雲，它因為歡樂而號叫！
這個敏感的精靈，——它從雷聲的震怒裏，早就聽出了睏乏，它深信，烏雲遮不住太陽，──是的，遮不住的！
狂風吼叫……雷聲轟響……
一堆堆烏雲，像青色的火焰，在無底的大海上燃燒。大海抓住閃電的箭光，把它們熄滅在自己的深淵裏。這些閃電的影子，活像一條條火蛇，在大海里蜿蜒遊動，一晃就消失了。
——暴風雨！暴風雨就要來啦！
這是勇敢的海燕，在怒吼的大海上，在閃電中間，高傲地飛翔；這是勝利的預言家在叫喊：

5. 相關鏈接

• Obsidian-Snippets CalloutTypesetting

6. 教學影片

＃＃您可能也會有興趣的類似文章

• [Obs＃52] 變更段落顏色與重點高亮度的CSS片段 (0則留言, 2021/09/20)
• [Obs＃39] 利用CSS變更文字顏色，侵入性小 (0則留言, 2021/05/10)
• [Obs＃77] 浮動式編輯窗格：Hover Editor　 (0則留言, 2022/03/19)
• Obsidian(黑曜石) 水平捲動面板的設定方法 (11則留言, 2020/06/27)
• [Obs＃25] 美化筆記的兩個外掛：Emoji Toolbar與Icons與自訂CSS樣式 (0則留言, 2021/01/30)
• [Obs#7] Obsidian(黑曜石) 多重游標的操作與兩個CSS樣式 (0則留言, 2020/07/13)
• [Obs＃68] 利用QuickAdd巨集由IMDB建立影片檔案，用Minimal主題顯示成卡片 (0則留言, 2022/02/06)
• [Obs#65] Obsidian exporter：將儲存庫匯出成標準Markdown格式 (0則留言, 2022/01/09)
• [Obs＃62] Obsidian搜尋全攻略 (0則留言, 2021/11/26)
• [Obs＃86] 分享與編輯器相關的21個Obsidian外掛 (0則留言, 2022/05/08)
• [Obs＃49] 快速準確的擷取網頁生成Markdown備忘：Obsidian Clipper瀏覽器擴充 (2則留言, 2021/09/05)
• [OBS＃20] templater: 無限擴充可能的第三方樣板外掛 (1則留言, 2020/11/26)
• [Obs＃82] 用Obsidian學會Markdown–Markdown完整解析 (0則留言, 2022/04/09)
• [Obs＃28] 與Table of Contents外掛相關的幾個HTML小技巧 (0則留言, 2021/03/13)
• [Obs＃29] Outliner plugin：智慧列表再進化 (0則留言, 2021/03/27)