---
title: "移除WordPress上传图片的宽度和高度参数"
url: "https://yjyj.net/learn/wordpress-learn/4336.html"
author: "小 虾 (生猛大蝦编辑部)"
published_at: "2013-12-27T14:25:12+08:00"
updated_at: "2013-12-27T14:25:12+08:00"
categories: "WordPress 学习"
tags: "wordpress, WordPress优化, WordPress开发, 前端开发实战, 图片"
summary: "本文教你在 WordPress 中移除上传图片自动附带的宽度和高度参数，解决图片标签不够灵活、样式难统一的问题。通过在 functions.php 加入过滤代码，即可自动清理 img 的 width/height 属性，省去手动修改的麻烦，适合需要统一前端图片表现的实战场景。"
source: "生猛大蝦 (https://yjyj.net)"
---

# 移除WordPress上传图片的宽度和高度参数

> 来源：[生猛大蝦 (yjyj.net)](https://yjyj.net/learn/wordpress-learn/4336.html) · 作者：小 虾 · 发布时间：2013-12-27

## 30 秒核心看点 (TL;DR)

- 在 functions.php 里加过滤器，就能自动去掉图片宽高属性。
- 适合统一前端样式、避免图片标签被固定尺寸限制。
- 代码简单但要注意正则只处理 HTML 输出，不影响原图文件。

我们都知道在wordpress后台上传的图片添加到日志内会附带宽高属性。虽然在 HTML 代码中直接为图片 img 标签书写宽高属性会为提高页面加载速度，但有时我们出于种种目的仍是需要去掉 WordPress 后台上传的的图片的宽高参数。那么我们该怎么做呢？

仍是需要在万能的 functions.php 上做文章，在其中加入下面的代码即可。

```
// Remove IMG Width Height
add_filter( 'post_thumbnail_html', 'remove_width_attribute', 10 );
add_filter( 'image_send_to_editor', 'remove_width_attribute', 10 );

function remove_width_attribute( $html ) {
   $html = preg_replace( '/(width|height)="\d*"\s/', "", $html );
   return $html;
}
```


这样我们就无需手动删除图片上的宽高属性，直接动态的将图片的宽度高度参数抹去了！

 

给力代码来自:http://www.wondercss.com/2013/wordpress/1544/

感谢原作者分享.

## 生猛大蝦编辑部 · 背景与实操延伸

这篇文章虽然短，但解决的是 WordPress 里很常见的“图片标签太死板”问题。后台插图默认带宽高属性，优点是能减少页面布局抖动；但在做响应式页面、统一图片比例或依赖 CSS 控制尺寸时，固定属性反而会添乱。实操时要注意：这段代码只改输出 HTML，不会改媒体库里的原图；如果主题还有其他图片输出入口，可能需要同步检查，避免出现一处生效、另一处仍保留宽高的情况。

## 延伸问答与排错指南 (FAQ)

### WordPress上传图片后为什么会自动带宽高参数？
这是 WordPress 在插入图片到文章或特色图时，默认输出的 HTML 属性，用来帮助浏览器预留布局空间。若你需要更灵活的响应式排版或统一样式，可以通过过滤输出内容来移除这些属性。

### 去掉图片宽高属性会影响图片显示吗？
不会影响图片文件本身，只是移除了 HTML 标签里的 width 和 height。实际显示效果取决于你的主题 CSS 和容器布局；如果没有配套样式，图片可能会按原始尺寸或受外层样式影响。

### 这段代码应该加到哪里最合适？
通常加到主题的 functions.php 中即可生效。建议先备份文件，再在测试环境验证，避免正则替换影响其他图片输出。若主题更新频繁，也可以考虑放到子主题中维护。

---
更多 Linux 运维、WordPress 性能优化、前端工程化、Shopify 独立站与极客折腾指南：[生猛大蝦全站文章归档 (https://yjyj.net/archive)](https://yjyj.net/archive)
