常用markdown语法(hugo)
目录
1 前言
本文大部分是在hugo
+loveit
主题两者基础上才有作用,具体参考loveit主题shortcode文档
2 代码块
2.1 TOML
baseURL = "http://example.org/"
# 更改使用 Hugo 构建网站时使用的默认主题
theme = "LoveIt"
# 网站标题
title = "我的全新 Hugo 网站"
# 网站语言, 仅在这里 CN 大写 ["en", "zh-CN", "fr", "pl", ...]
languageCode = "zh-CN"
# 语言名称 ["English", "简体中文", "Français", "Polski", ...]
languageName = "简体中文"
# 是否包括中日韩文字
hasCJKLanguage = true
2.2 bash
git clone https://github.com/dillonzq/LoveIt.git themes/LoveI
2.3 css
@import url('https://fonts.googleapis.com/css?family=Fira+Mono:400,700&display=swap&subset=latin-ext');
$code-font-family: Fira Mono, Source Code Pro, Menlo, Consolas, Monaco, monospace;
3 admonition
注意
注意
admonition note
admonition note
admonition tip
admonition tip
4 版本
5 图片
5.1 默认
![](/images/fengmian4.jpg)
5.2 控制大小和位置(1)
<p align="center">
<img src="/images/fengmian4.jpg" width="200" />
</p>
<center>图示</center>
5.3 控制大小和位置(2)
<center>
<img width="300" src="/images/fengmian4.jpg">
<div style="color:black;"> <b> 图示 </b> </div>
</center>
图示
5.4 控制大小和位置(3)
<center>
{{< image src="/images/fengmian4.jpg" title="停留显示"width="50%" >}}
<div style="color:black;"> <b> 图示 </b> </div>
</center>
技巧
1.此shortcode需
2.这种方式显示的图片配合loveit主题可以点击放大,停留显示文案等
loveit
主题支持 2.这种方式显示的图片配合loveit主题可以点击放大,停留显示文案等
图示
Bug
主题应该是有bug, 当设置
caption
图片标题, 会造成width
属性失效,所以这里加div
标签达到效果