天天看点

markdown笔记1--设置字体、颜色、图片、背景色

markdown笔记1--设置字体、颜色、图片、背景色

  • ​​1 常见文字特性​​
  • ​​2 常见字符使用​​
  • ​​3 图片链接表示方法​​
  • ​​4 颜色设置​​
  • ​​5 常见问题​​
  • ​​说明​​

1 常见文字特性

设置字体和颜色:

<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>
<font color=red>我是红色</font>
<font color=#008000>我是绿色</font>
<font color=Blue>我是蓝色</font>
<font size=5>我是尺寸</font>
<font face="黑体" color=green size=5>我是黑体,绿色,尺寸为5</font>      

我是黑体字

我是微软雅黑

我是华文彩云

我是红色

我是绿色

我是蓝色

我是尺寸

我是黑体,绿色,尺寸为5

设置字体背景色

md默认不支持字体背景色,可以通过html的table来实现字体背景色;
<table><tr><td bgcolor=pink>背景色yellow</td></tr></table>      
背景色yellow

2 常见字符使用

  1. 空格
  • 全角状态下,直接按空格就是四个空格;
  • 半方大的空白&ensp;或&#8194;
  • 全方大的空白&emsp;或&#8195;
  • 不断行的空白格&nbsp;或&#160;
  • 把输入法切换到全角(一般是shift+空格) 然后再按空格就能够显示了

3 图片链接表示方法

默认格式如下,后面#pic_center 可以确定图片相对位置
![在这里插入图片描述](https://s2.51cto.com/images/blog/202208/29094218_630c197a58c7284294.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=#pic_center )
也可以通过html的 img标签,添加width和height来设置宽高比例和大小
<img src="https://s2.51cto.com/images/blog/202208/29094218_630c197a58c7284294.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_30,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk=" width="50%" height="50%">
<img src="https://s2.51cto.com/images/blog/202208/29094218_630c197a58c7284294.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_30,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk=" width="360" height="360" >

图片左对齐、居中、右对齐(也可以通过上面追加 #pic_left|center|right 的方式设置位置)
<div align=left><img  src="https://s2.51cto.com/images/blog/202208/29094218_630c197a714f18709.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_30,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk="/></div>
<div align=center><img  src="https://s2.51cto.com/images/blog/202208/29094218_630c197a714f18709.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_30,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk="/></div>
<div align=right><img  src="https://s2.51cto.com/images/blog/202208/29094218_630c197a714f18709.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_30,g_se,x_10,y_10,shadow_20,type_ZmFuZ3poZW5naGVpdGk="/></div>      

图1原始方式:

image标签宽高都等比缩小50%

image标签设置宽高都为360

图片左对齐:

markdown笔记1--设置字体、颜色、图片、背景色

图片居中:

markdown笔记1--设置字体、颜色、图片、背景色

图片右对其:

markdown笔记1--设置字体、颜色、图片、背景色

4 颜色设置

5 常见问题

  1. to add

说明

继续阅读