CSDN博客寫作

記錄CSDN博客寫作中的各種方法。

1. 圖片

在CSDN寫博客的過程中,插入圖片,往往顯示特別大,而且CSDN沒有直接調整圖片大小這個功能,在此提供幾個調整圖片大小的方法。

例如直接插入圖片時,CSDN的原始顯示圖像如下:

在這裏插入圖片描述

方法一:我們上傳圖片後,進入編輯模式會在圖片下方看到CSDN返回來的一個圖片URL,如下所示:

在此URL的最後加上“空格 =200x200”,即可按喜好調整圖片大小:

這樣就可以得到調整後的圖片,如下所示。但此方法比例往往不好拿捏,圖片容易變形。

在這裏插入圖片描述

方法二:按比例調整圖片大小。

CSDN返回的圖片代碼爲:

![在這裏插入圖片描述](https://img-blog.csdnimg.cn/20200630165803279.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTA3MDU5MzI=,size_16,color_FFFFFF,t_70)

若想按比例調整圖片大小,且仍然帶有水印,只需將圖片鏈接提取出來,括號內的就是所需要的鏈接,即https://img-blog.csdnimg.cn/20200630165803279.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTA3MDU5MzI=,size_16,color_FFFFFF,t_70

將鏈接複製並代替下面這行代碼中的“鏈接”這兩個字。

<img src="鏈接" width="40%">

width="xx%"處填寫想調整成的任意百分比,此時代碼改爲:

<img src="https://img-blog.csdnimg.cn/20200630165803279.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTA3MDU5MzI=,size_16,color_FFFFFF,t_70" width="40%">

即可得到縮放調整後的圖片:

方法三:按比例調整圖片大小,並去掉水印。

CSDN返回的圖片代碼:

![在這裏插入圖片描述](https://img-blog.csdnimg.cn/20200630165803279.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTA3MDU5MzI=,size_16,color_FFFFFF,t_70)

只需將上述代碼改爲:

 <img src="https://img-blog.csdnimg.cn/20200630165803279.jpeg" width="xx%">

width="xx%"處填寫想調整成的百分比,即可得到縮放調整去水印後的圖片:

參考資源

[1] CSDN博客調整圖片大小、位置、格式去水印的方法

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章