Next主题 - 图片设置

发表于 更新于 分类于 阅读次数：

添加图片

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

  • 插入网络图片可以用常用的Markdown的方式进行插入: ![img-title](img-url)
  • 插入本地图片，主要涉及到本地图片资源的管理，相对插入网络图片复杂一些，但是引用方式大同小异，针对插入本地图片我们稍做展开
插入本地图片 -01
  1. 安装插件: 在博客的根目录下执行： npm install hexo-asset-image --save 或 npm 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/>