HUGO

  • 新闻
  • 文档
  • 主题
  • 社区
  • GitHub
gohugoio Star
  • 关于
    • 本节内容
    • 简介
    • 特性
    • 隐私
    • 安全
    • 许可证
  • 安装
    • 本节内容
    • macOS
    • Linux
    • Windows
    • BSD
  • 开始使用
    • 本节内容
    • 快速入门
    • 基本用法
    • 目录结构
    • 配置
    • 配置标记
    • 配置构建
    • 术语表
    • 外部学习资源
  • 快速参考
    • 本节内容
    • 表情符号
    • 函数
    • 方法
    • 页面集合
  • 内容管理
    • 本节内容
    • 组织
    • 页面包
    • 内容格式
    • Front matter
    • 构建选项
    • 页面资源
    • 图像处理
    • 短代码
    • 相关内容
    • 章节
    • 内容类型
    • 原型
    • 分类法
    • 摘要
    • 链接和交叉引用
    • URL 管理
    • 菜单
    • 评论
    • 多语言
    • Markdown 属性
    • 语法高亮
    • 图表
    • 数学
    • 数据源
    • 内容适配器
  • 模板
    • 本节内容
    • 简介
    • 模板类型
    • 查找顺序
    • 基础模板
    • 主页模板
    • 单页模板
    • 章节模板
    • 分类法模板
    • 术语模板
    • 部分模板
    • 内容视图模板
    • 短代码模板
    • 站点地图模板
    • RSS 模板
    • 404 模板
    • robots.txt 模板
    • 菜单
    • 分页
    • 嵌入式模板
    • 自定义输出格式
  • 函数
    • 本节内容
    • cast
    • collections
    • compare
    • crypto
    • css
    • data
    • debug
    • diagrams
    • encoding
    • fmt
    • global
    • go template
    • hash
    • hugo
    • images
    • inflect
    • js
    • lang
    • math
    • openapi3
    • os
    • partials
    • path
    • reflect
    • resources
    • safe
    • strings
    • templates
    • time
    • transform
    • urls
  • 方法
    • 本节内容
    • Duration
    • Menu
    • Menu entry
    • Page
    • Pager
    • Pages
    • Resource
    • Shortcode
    • Site
    • Taxonomy
    • Time
  • 渲染钩子
    • 本节内容
    • 简介
    • 块引用
    • 代码块
    • 标题
    • 图像
    • 链接
    • 透传
    • 表格
  • 短代码
    • 本节内容
    • 评论
    • 详情
    • 图
    • Gist
    • 高亮
    • Instagram
    • 参数
    • QR
    • Ref
    • Relref
    • Vimeo
    • X
    • YouTube
  • Hugo 模块
    • 本节内容
    • 配置 Hugo 模块
    • 使用 Hugo 模块
    • 主题组件
  • Hugo Pipes
    • 本节内容
    • 简介
    • 将 Sass 转译为 CSS
    • PostCSS
    • 后期处理
    • JavaScript 构建
    • 资源缩小化
    • 连接资源
    • 指纹和 SRI 哈希
    • 来自字符串的资源
    • 来自模板的资源
  • CLI
  • 故障排除
    • 本节内容
    • 审计
    • 日志记录
    • 检查
    • 弃用
    • 性能
    • 常见问题
  • 开发者工具
    • 本节内容
    • 编辑器插件
    • 前端
    • 搜索
    • 迁移
    • 其他项目
  • 托管和部署
    • 本节内容
    • Hugo Deploy
    • 使用 Rclone 部署
    • 使用 Rsync 部署
    • 在 21YunBox 上托管
    • 在 AWS Amplify 上托管
    • 在 Azure 静态 Web 应用上托管
    • 在 Cloudflare Pages 上托管
    • 在 Firebase 上托管
    • 在 GitHub Pages 上托管
    • 在 GitLab Pages 上托管
    • 在 KeyCDN 上托管
    • 在 Netlify 上托管
    • 在 Render 上托管
  • 贡献
    • 本节内容
    • 开发
    • 文档
    • 主题
  • 维护
函数 图像函数

images.Filter

将一个或多个图像滤镜应用于给定的图像资源。

语法

images.Filter FILTERS... IMAGE

返回值

images.ImageResource

将一个或多个图像滤镜应用于给定的图像。

要应用单个滤镜

{{ with resources.Get "images/original.jpg" }}
  {{ with images.Filter images.Grayscale . }}
    <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
  {{ end }}
{{ end }}

要应用两个或多个滤镜,从左到右执行

{{ $filters := slice
  images.Grayscale
  (images.GaussianBlur 8)
}}
{{ with resources.Get "images/original.jpg" }}
  {{ with images.Filter $filters . }}
    <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
  {{ end }}
{{ end }}

您还可以使用 Resource 对象上的 Filter 方法应用图像滤镜。

示例

{{ with resources.Get "images/original.jpg" }}
  {{ with images.Filter images.Grayscale . }}
    <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
  {{ end }}
{{ end }}

原始

Zion National Park

已处理

Zion National Park

图像滤镜

将以下任何滤镜与 images.Filter 函数或 Resource 对象上的 Filter 方法一起使用。

images.AutoOrient
返回一个图像滤镜,该滤镜根据其 EXIF 方向标签旋转和翻转图像。
images.Brightness
返回一个图像滤镜,该滤镜更改图像的亮度。
images.ColorBalance
返回一个图像滤镜,该滤镜更改图像的颜色平衡。
images.Colorize
返回一个图像滤镜,该滤镜生成图像的着色版本。
images.Contrast
返回一个图像滤镜,该滤镜更改图像的对比度。
images.Dither
返回一个抖动图像的图像滤镜。
images.Gamma
返回一个图像滤镜,该滤镜对图像执行伽玛校正。
images.GaussianBlur
返回一个图像滤镜,该滤镜对图像应用高斯模糊。
images.Grayscale
返回一个图像滤镜,该滤镜生成图像的灰度版本。
images.Hue
返回一个图像滤镜,该滤镜旋转图像的色调。
images.Invert
返回一个图像滤镜,该滤镜反转图像的颜色。
images.Mask
返回一个图像滤镜,该滤镜将蒙版应用于源图像。
images.Opacity
返回一个图像滤镜,该滤镜更改图像的不透明度。
images.Overlay
返回一个图像滤镜,该滤镜在给定坐标处相对于左上角覆盖源图像。
images.Padding
返回一个图像滤镜,该滤镜在不调整图像大小的情况下调整图像画布的大小。
images.Pixelate
返回一个图像滤镜,该滤镜对图像应用像素化效果。
images.Process
返回一个图像滤镜,该滤镜使用给定的规范处理给定的图像。
images.QR
使用指定的选项将给定的文本编码为 QR 码,返回图像资源。
images.Saturation
返回一个图像滤镜,该滤镜更改图像的饱和度。
images.Sepia
返回一个图像滤镜,该滤镜生成图像的棕褐色调版本。
images.Sigmoid
返回一个图像滤镜,该滤镜使用 Sigmoid 函数更改图像的对比度。
images.Text
返回一个图像滤镜,该滤镜向图像添加文本。
images.UnsharpMask
返回一个锐化图像的图像滤镜。

另请参阅

  • Filter

本页内容

  • 示例
  • 图像滤镜

本节内容

  • images.AutoOrient
  • images.Brightness
  • images.ColorBalance
  • images.Colorize
  • images.Config
  • images.Contrast
  • images.Dither
  • images.Filter
  • images.Gamma
  • images.GaussianBlur
  • images.Grayscale
  • images.Hue
  • images.Invert
  • images.Mask
  • images.Opacity
  • images.Overlay
  • images.Padding
  • images.Pixelate
  • images.Process
  • images.QR
  • images.Saturation
  • images.Sepia
  • images.Sigmoid
  • images.Text
  • images.UnsharpMask
上次更新时间:2024 年 2 月 3 日:将指向变量页面的链接替换为指向方法页面的链接 (b8d5383f7)
改进此页面
由 Hugo 作者提供
Hugo Logo
  • 提交问题
  • 获取帮助
  • @GoHugoIO
  • @spf13
  • @bepsays

Netlify badge

 

Hugo 赞助商

您的公司?
 

Hugo 徽标的版权归 Steve Francia 所有,2013-2025 年。

Hugo Gopher 基于 Renée French 的原创作品。

  • 新闻
  • 文档
  • 主题
  • 社区
  • GitHub
  • 关于
  • 安装
  • 开始使用
  • 快速参考
  • 内容管理
  • 模板
  • 函数
  • 方法
  • 渲染钩子
  • 短代码
  • Hugo 模块
  • Hugo Pipes
  • CLI
  • 故障排除
  • 开发者工具
  • 托管和部署
  • 贡献
  • 维护