0%

Next主题 - 图片设置

添加图片

Hexo有网络图片插入本地图片两种方式:

  • 插入网络图片可以用常用的Markdown的方式进行插入: ![img-title](img-url)
  • 插入本地图片,主要涉及到本地图片资源的管理,相对插入网络图片复杂一些,但是引用方式大同小异,针对插入本地图片我们稍做展开
插入本地图片 -01
  1. 安装插件: 在博客的根目录下执行:npm install hexo-asset-image --savenpm install hexo-asset-image --g
  2. 修改站点配置文件_config.yml: 找到 post_asset_folder,把值改成 true,这样在执行hexo new page 的时候,会在source/_posts文件夹下生成一个和page同名的文件夹,可以存放该page中用到的图片
  3. 插入本地图片![imageTitle](img.jpg)
插入本地图片-02
  1. source下建立一个_posts同级别的文件夹 images,将图片放入其中,此时的图片路径为:
    /hexo/source/images/img.png
  2. 插入图片,要使用相对路径,应写为![imageTitle](/images/img.png)

修改图片的大小

图片默认会显示原本的图片大小并居中显示,如果需要对图片大小进行设置,需要另外写 css 样式进行控制。当使用上面的方式创建和page同名的文件夹的时候,可使用下面的方式更改图片的大小

1
<img src="img.jpg" width=80% height=50% align=center/>

或者

1
<img src="/images/img.png" width=80% height=50% align=center/>

欢迎关注我的其它发布渠道