Tabs Inline 1 2 This is my website, click the button {% btn 'https://butterfly.js.org',Butterfly %} This is my website, click the button {% btn 'https://butterfly.js.org',Butterfly,,outline%}
This is my website, click the button Butterfly
This is my website, click the button Butterfly
Block 1 2 3 This is my website, click the button {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,block larger %} This is my website, click the button {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,block center larger %} This is my website, click the button {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,block right blue larger %}
Butterfly Butterfly Butterfly option more than one button in center
1 2 3 4 5 6 7 8 9 <div class ="btn-center" > {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,blue larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,pink larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,red larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,purple larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,orange larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,green larger %} </div >
1 2 3 4 5 6 7 8 9 <div class ="btn-center" > {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline blue larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline pink larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline red larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline purple larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline orange larger %} {% btn 'https://butterfly.js.org',Butterfly,far fa-hand-point-right,outline green larger %} </div >
mermaid pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5
gantt title A Gantt Diagram dateFormat YYYY-MM-DD section Section A task :a1, 2014-01-01, 30d Another task :after a1 , 20d section Another Task in sec :2014-01-12 , 12d another task : 24d
gantt title A Gantt Diagram dateFormat YYYY-MM-DD section Section A task :a1, 2014-01-01, 30d Another task :after a1 , 20d section Another Task in sec :2014-01-12 , 12d another task : 24d
Note (Bootstrap Callout) 方法一 simple
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 {% note simple %} 默認 提示塊標籤 {% endnote %} {% note default simple %} default 提示塊標籤 {% endnote %} {% note primary simple %} primary 提示塊標籤 {% endnote %} {% note success simple %} success 提示塊標籤 {% endnote %} {% note info simple %} info 提示塊標籤 {% endnote %} {% note warning simple %} warning 提示塊標籤 {% endnote %} {% note danger simple %} danger 提示塊標籤 {% endnote %}
modern
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 {% note modern %} 默認 提示塊標籤 {% endnote %} {% note default modern %} default 提示塊標籤 {% endnote %} {% note primary modern %} primary 提示塊標籤 {% endnote %} {% note success modern %} success 提示塊標籤 {% endnote %} {% note info modern %} info 提示塊標籤 {% endnote %} {% note warning modern %} warning 提示塊標籤 {% endnote %} {% note danger modern %} danger 提示塊標籤 {% endnote %}
flat
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 {% note flat %} 默認 提示塊標籤 {% endnote %} {% note default flat %} default 提示塊標籤 {% endnote %} {% note primary flat %} primary 提示塊標籤 {% endnote %} {% note success flat %} success 提示塊標籤 {% endnote %} {% note info flat %} info 提示塊標籤 {% endnote %} {% note warning flat %} warning 提示塊標籤 {% endnote %} {% note danger flat %} danger 提示塊標籤 {% endnote %}
disabled
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 {% note disabled %} 默認 提示塊標籤 {% endnote %} {% note default disabled %} default 提示塊標籤 {% endnote %} {% note primary disabled %} primary 提示塊標籤 {% endnote %} {% note success disabled %} success 提示塊標籤 {% endnote %} {% note info disabled %} info 提示塊標籤 {% endnote %} {% note warning disabled %} warning 提示塊標籤 {% endnote %} {% note danger disabled %} danger 提示塊標籤 {% endnote %}
no-icon
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 {% note no-icon %} 默認 提示塊標籤 {% endnote %} {% note default no-icon %} default 提示塊標籤 {% endnote %} {% note primary no-icon %} primary 提示塊標籤 {% endnote %} {% note success no-icon %} success 提示塊標籤 {% endnote %} {% note info no-icon %} info 提示塊標籤 {% endnote %} {% note warning no-icon %} warning 提示塊標籤 {% endnote %} {% note danger no-icon %} danger 提示塊標籤 {% endnote %}
方法二 simple
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 {% note 'fab fa-cc-visa' simple %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note blue 'fas fa-bullhorn' simple %} 2021年快到了.... {% endnote %} {% note pink 'fas fa-car-crash' simple %} 小心開車 安全至上 {% endnote %} {% note red 'fas fa-fan' simple%} 這是三片呢?還是四片? {% endnote %} {% note orange 'fas fa-battery-half' simple %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note purple 'far fa-hand-scissors' simple %} 剪刀石頭布 {% endnote %} {% note green 'fab fa-internet-explorer' simple %} 前端最討厭的瀏覽器 {% endnote %}
modern
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 {% note 'fab fa-cc-visa' modern %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note blue 'fas fa-bullhorn' modern %} 2021年快到了.... {% endnote %} {% note pink 'fas fa-car-crash' modern %} 小心開車 安全至上 {% endnote %} {% note red 'fas fa-fan' modern%} 這是三片呢?還是四片? {% endnote %} {% note orange 'fas fa-battery-half' modern %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note purple 'far fa-hand-scissors' modern %} 剪刀石頭布 {% endnote %} {% note green 'fab fa-internet-explorer' modern %} 前端最討厭的瀏覽器 {% endnote %}
flat
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 {% note 'fab fa-cc-visa' flat %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note blue 'fas fa-bullhorn' flat %} 2021年快到了.... {% endnote %} {% note pink 'fas fa-car-crash' flat %} 小心開車 安全至上 {% endnote %} {% note red 'fas fa-fan' flat%} 這是三片呢?還是四片? {% endnote %} {% note orange 'fas fa-battery-half' flat %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note purple 'far fa-hand-scissors' flat %} 剪刀石頭布 {% endnote %} {% note green 'fab fa-internet-explorer' flat %} 前端最討厭的瀏覽器 {% endnote %}
disabled
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 {% note 'fab fa-cc-visa' disabled %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note blue 'fas fa-bullhorn' disabled %} 2021年快到了.... {% endnote %} {% note pink 'fas fa-car-crash' disabled %} 小心開車 安全至上 {% endnote %} {% note red 'fas fa-fan' disabled %} 這是三片呢?還是四片? {% endnote %} {% note orange 'fas fa-battery-half' disabled %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note purple 'far fa-hand-scissors' disabled %} 剪刀石頭布 {% endnote %} {% note green 'fab fa-internet-explorer' disabled %} 前端最討厭的瀏覽器 {% endnote %}
no-icon
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 {% note no-icon %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note blue no-icon %} 2021年快到了.... {% endnote %} {% note pink no-icon %} 小心開車 安全至上 {% endnote %} {% note red no-icon %} 這是三片呢?還是四片? {% endnote %} {% note orange no-icon %} 你是刷 Visa 還是 UnionPay {% endnote %} {% note purple no-icon %} 剪刀石頭布 {% endnote %} {% note green no-icon %} 前端最討厭的瀏覽器 {% endnote %}
Gallery 相冊圖庫 壁紙
收藏的一些壁紙
漫威
關於漫威的圖片
OH MY GIRL
關於OH MY GIRL的圖片
Gallery 相冊 tag-hide 隱藏文字,點擊顯示文章
hide-inline 哪個英文字母最酷? 查看答案 因為西裝褲(C裝酷)
門裡站著一個人? Click 閃
hide-block 美女
hide-toggle Butterfly安裝方法
在你的博客根目錄裏
1 git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly
如果想要安裝比較新的dev分支,可以
1 git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly
轉載來自 https://butterfly.js.org/