一、图片操作
1. 调整插入的图片的位置
在Markdown语法中,插入图片默认位置是居中的,可是有时候还是需要居左或者居右一下滴,既然遇到了就记一下吧。
先记录一下下面页面中图片依然全部居中的问题
问题:在Typora中写好都显示没问题,提交上来以后都居中了
原因:hexo 的Metary主题在进行渲染的时候,对图片进行了居中操作。
下边的方法没问题。
(1)方法一
在img
标签中插入div
标签中
<div align=left>
(居左)<div align=right>
(居右)<div align=center>
(居中)
示例:
<div align=left>
<img src="https://gitee.com/arvin-he/blog-img/raw/master/tag-img/wallpaper36.jpg" width=50% />
</div>
效果:
(2)方法二
在img
标签中插入style
属性,例如:style="margin-left:45px"
。以右侧为基准可以插入style=“margin-right:45px”
。
示例:
<img src="https://gitee.com/arvin-he/blog-img/raw/master/tag-img/wallpaper36.jpg
" width=50% style="margin-left: 45px">
效果:
2. 调整图片大小
在img
标签中插入width
和height
属性
例1:
<img src="https://gitee.com/arvin-he/blog-img/raw/master/tag-img/wallpaper36.jpg
" width=30%>
效果:
例2:
<img src="https://gitee.com/arvin-he/blog-img/raw/master/tag-img/wallpaper36.jpg
" width=100px height=100px>
效果:
总结:
- 可以使用
%
百分比的形式,也可以使用像素单位px
- 使用百分比的形式时,只需要写
width
属性即可 - 使用
px
时,width
和height
都需要写,更精准的控制图片大小
二、数学表达式
遇到数学表达式,该怎么写出来呢?
1. 幂运算
(1)HTML标签
例如:10的5次方
实现:
10<sup>5</sup>
效果: 105
(2)Markdown语法
例如:10的5次方
实现:
10^5^
效果:10^5^
2. Markdown中插入多行大括号公式
(1)方法1
$$ f(x)=\left\{
\begin{aligned}
x & = & \cos(t) \\
y & = & \sin(t) \\
z & = & \frac xy
\end{aligned}
\right.
$$
效果:
$$
f(x)=\left{
\begin{aligned}
x & = & \cos(t) \
y & = & \sin(t) \
z & = & \frac xy
\end{aligned}
\right.
$$
(2)方法2
$$ F^{HLLC}=\left\{
\begin{array}{rcl}
F_L & & {0 < S_L}\\
F^*_L & & {S_L \leq 0 < S_M}\\
F^*_R & & {S_M \leq 0 < S_R}\\
F_R & & {S_R \leq 0}
\end{array} \right. $$
效果:
$$
F^{HLLC}=\left{
\begin{array}{rcl}
F_L & & {0 < S_L}\
F^_L & & {S_L \leq 0 < S_M}\
F^_R & & {S_M \leq 0 < S_R}\
F_R & & {S_R \leq 0}
\end{array} \right.
$$
(3)方法3
$$f(x)=
\begin{cases}
0& \text{x=0}\\
1& \text{x!=0}
\end{cases}$$
效果:
$$
f(x)=
\begin{cases}
0& \text{x=0}\
1& \text{x!=0}
\end{cases}
$$