添加图片
Hexo有网络图片
和插入本地图片
两种方式:
- 插入网络图片可以用常用的Markdown的方式进行插入:
![img-title](img-url)
- 插入本地图片,主要涉及到本地图片资源的管理,相对插入网络图片复杂一些,但是引用方式大同小异,针对插入本地图片我们稍做展开
插入本地图片 -01
- 安装插件: 在博客的根目录下执行:
npm install hexo-asset-image --save
或npm install hexo-asset-image --g
- 修改站点配置文件
_config.yml
: 找到post_asset_folder
,把值改成true
,这样在执行hexo new page
的时候,会在source/_posts
文件夹下生成一个和page
同名的文件夹,可以存放该page
中用到的图片 - 插入本地图片
![imageTitle](img.jpg)
插入本地图片-02
- 在
source
下建立一个_posts
同级别的文件夹images
,将图片放入其中,此时的图片路径为:/hexo/source/images/img.png
- 插入图片,要使用相对路径,应写为
![imageTitle](/images/img.png)
修改图片的大小
图片默认会显示原本的图片大小并居中显示,如果需要对图片大小进行设置,需要另外写 css 样式进行控制。当使用上面的方式创建和page
同名的文件夹的时候,可使用下面的方式更改图片的大小
<img src="img.jpg" width=80% height=50% align=center/>
或者
<img src="/images/img.png" width=80% height=50% align=center/>