Try   HackMD

theorem theme 說明文件

功能

在 HackMD 筆記加入下列,即可套用 theorem theme。

{%hackmd @YuRen-tw/theorem-theme %}

套用後,就可以用以下的 HTML 產出對應的定理區塊:

<div class="theorem">

  Prime numbers are more than any assigned multitude of prime numbers.
</div>
<div class="proof">

  See Euclid's Elements, Book IX, Proposition 20 for the details.
</div>

Prime numbers are more than any assigned multitude of prime numbers.

See Euclid's Elements, Book IX, Proposition 20 for the details.

定理區塊

這個主題提供五種可用於代表數學定理、定義、證明的類別。
五種類別的差異只在於名稱與樣式:

.theorem .definition .example .remark .proof
標題 bold bold bold italic italic
內文 italic normal normal normal normal
底色 :o: :o: :o:
外框 :o: :o:

在 LaTeX 的 amsthm 中,.theorem 的樣式稱為 plain 樣式,並且沒有 example 樣式(通常都用 definition 樣式,然而在 beamer 中有套用特別設定)。

標題名稱

  • 按照不同的類別有對應的名稱
  • 可以使用 data-name 屬性自訂名稱
  • 為了方便使用,.theorem 又預設有幾個子類別
    • .proposition.lemma.corollary
    • <div class="theorem lemma"> 就是 <div class="theorem" data-name="lemma">
  • 不同語言模式會顯示不同的名稱,參考下方的語言模式

標題編號

  • 除了 .proof,區塊都有編號顯示在名稱之後
  • 可以加上 .unnumbered 類別取消編號
  • 編號格式為 X.Y
    • X<h2> 編號一致
    • 每當有新的編號區塊,Y 都會增加
    • 每當有新的 <h2>Y 都會重設

標題額外資訊

  • 除了 .proof,區塊都可以用 data-info 設定額外資訊顯示在編號之後
  • 不同語言模式會有不同的標註方式,參考下方的語言模式

語言模式

在不同內文語言模式下,預設的文字與格式也會有所不同。

內文語言參照 HackMD 的內容設定:

  • 英語文模式:English(en- 開頭)
  • 華語文模式:其他設定

不同語言的標題名稱

華語文模式 英語文模式
.theorem 定理 Theorem
.lemma 引理 Lemma
.corollary 系理 Corollary
.proposition 命題 Proposition
.definition 定義 Definition
.remark 說明 Remark
.example 範例 Example
.proof 證明 Proof

下面列出我們沒有預設但在數學文獻上可能會用到的區塊提供給使用者參考。

常用區塊樣式 華語文 英語文
.theorem 猜想 Conjecture
.theorem 準則 Criterion
.theorem 斷言 Assertion
.definition 條件 Condition
.definition 公理 Axiom
.definition 性質 Property
.definition 假設 Assumption
.definition 演算法 Algorithm
.example 問題 Problem
.example 練習 Exercise
.remark Note
.remark 主張 Claim
.remark 總結 Summary
.remark 情況 Case

不同語言的額外資訊標註方式

華語文模式 英語文模式
名稱 X.Y Name X.Y.
名稱 X.Y:資訊 Name X.Y (info).
名稱:資訊 Name (info).

:gear: CSS 設定

一般樣式

  • 底色:--thm-background-color
  • 外框:--thm-outline-color
  • 證明結束方塊:--qed-symbol
  • 區塊下邊界:--thm-margin
  • 區塊上下留白:--thm-padding-box
  • 區塊左右留白:--thm-padding-inline
  • 標題下留白:--thm-padding-head

計數器

這個主題使用了 sectiontheorem 兩個 CSS 計數器。
相關設定如下,做為與其他主題衝突時的修改參考。

body {
  counter-reset: section;
}
h2 {
  counter-increment: section;
  counter-reset: theorem;
}
:is(.theorem, .definition, .remark, .example):not(.unnumbered) {
  counter-increment: theorem;
}

範例

  • ​​<div class="theorem">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="theorem lemma unnumbered">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="theorem" data-name="Conjecture">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="definition" data-info="info">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="remark">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="example" data-name="Exercise">
    
    ​​  Text text.
    ​​</div>
    

    Text text.

  • ​​<div class="proof" data-name="Proof of the Main Theorem">
    
    ​​  Text text.
    ​​</div>
    

    Text text.