项目环境：
Window10，Edge123.0.2420.65
问题描述：
当我在CSDN写博文的时候，会经常插入一些图片，但有时候我插入的图片太大了，影响了整体排版。
比如我加入了一张图片，就变成了下面这个样子，看起来很不舒服，太大了，还不居中。
原因分析：
一般情况下，在CSDN中插入的图片都是默认格式。
上传图片到文章时，图片底部都会有一个URL链接，可能CSDN对这个链接进行了处理？
CSDN给出的上方图片URL：
https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_16,color_FFFFFF,t_70通过对图片的URL链接进行修改知道了如下信息：
x-oss-process=image/watermark,代表了： 对图片进行处理，添加水印；
type_ZmFuZ3poZW5naGVpdGk,代表了：图片水印的格式类型为ZmFuZ3poZW5naGVpdGk，base64解码后是“fangzhengzhidao”，即方正字体；
shadow_10,代表了： 图片水印的文字阴影程度为10，可能是深度或者强度，没去认真研究；
text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,代表了：图片版权信息或来源链接，base64解码后为“https://blog.csdn.net/Suemagic”；
size_16,代表了： 图片水印的文字大小为16；
color_FFFFFF,代表了：图片水印的文字颜色为FFFFFF；
t_70代表了：图片水印的文字透明度为70；
解决：
CSDN对图片只进行了标准化的水印处理，那我们只能利用HTML/CSS格式引入链接进行图片的宽度调整
①利用HTML格式进行图片的宽度百分比width="30%"调整
宽度调整1：
<img src="https://img-blog.csdnimg.cn/20181228220902381.png" width="30%">
width="300" height="100"
②利用HTML格式进行图片的宽高数值width="300" height="100"调整
宽度调整2：
<img src="https://img-blog.csdnimg.cn/20181228220902381.png" width="300" height="190">更多效果：
利用HTML/CSS格式引入链接对图片在文章中的位置进行调整，以及给图片备注
对图片的水印进行一个个性化操作
一、图片显示位置调整
①CSDN链接结尾带上#pic_left（居左） 、 #pic_center（居中）、#pic_right（居右）
居右：
https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_16,color_FFFFFF,t_70#pic_right
②HTML格式加入center（居中）、left（居左）（没法居右，直接在img标签里加入style="float: left也是没有用的，但是依旧可通过上面的方法，在结尾加上#pic_right来达到居右效果）
居中：
<center><img src="https://img-blog.csdnimg.cn/20181228220902381.png" width="10%"></center>③HTML格式加入img标签，在URL链接结尾加上#pic_right来达到居右效果
二、图片题注
①HTML格式加入img标签，并在下方加入font标签
题注1：
<center> <img src="https://img-blog.csdnimg.cn/20181228220902381.png" width="10%"> </center><center><b><font size ='3'>图1. 这是图1的题注</font></b></center></font><!--font size = '3',表示文字的大小为3--><!--当然也可以不要，直接用center-->②HTML格式在您想要添加题注的图片的<img>标签下方，添加一个<figcaption>标签(<figcaption style="font-size: 20px;">没办法更改字体大小)
题注2：
<img src="https://img-blog.csdnimg.cn/20181228220902381.png" alt="图片描述">
<figcaption>图2. 这是上面这张图的题注</figcaption>三、图片水印修改（不知道字体格式）
①CSDN链接修改水印阴影
水印阴影修改：shadow_100
<img src="https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_100,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_48,color_eb3c70,t_100" alt="图片描述">
<figcaption>图3. 这是上面这张图的题注</figcaption>
②CSDN链接修改水印文字
水印文字修改：text_dnhaZVhpbjAy
<img src="https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_100,text_dnhaZVhpbjAy,size_48,color_eb3c70,t_100#pic_center" width="40%" alt="图片描述">
<figcaption>图3. 这是上面这张图的题注</figcaption>
③CSDN链接修改水印文字大小
水印文字大小修改：size_48
<img src="https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_100,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_48,color_eb3c70,t_100" alt="图片描述">
<figcaption>图3. 这是上面这张图的题注</figcaption>
④CSDN链接修改水印文字颜色
水印文字颜色修改：color_eb3c70
<img src="https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_100,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_48,color_eb3c70,t_100" alt="图片描述">
<figcaption>图3. 这是上面这张图的题注</figcaption>
t_70代表了：图片水印的文字透明度为70；
⑤CSDN链接修改水印文字透明度
文字透明度修改：t_10
<img src="https://img-blog.csdnimg.cn/20181228220902381.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_100,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1N1ZU1hZ2lj,size_48,color_eb3c70,t_100" alt="图片描述">
<figcaption>图3. 这是上面这张图的题注</figcaption>
希望本文对你安装Python的第三方库提供了帮助。
SueMagic wish you a happy coding~
有疑问可联系我。
