如何移除WordPress原生图库缩略图的白色粗边框？

嘿，我完全懂你试了N多CSS都没搞定这个边框的挫败感——我之前帮客户调试WordPress站点时也踩过原生图库样式优先级的坑，给你几个亲测有效的方案：

• 精准命中区块编辑器图库的样式（最常用）
  WordPress的区块编辑器（Gutenberg）生成的图库会带特定的类名，直接用这个高优先级的选择器覆盖：

  /* 移除区块编辑器图库缩略图的白色边框及相关样式 */
  .wp-block-gallery .wp-block-image img {
    border: none !important;
    padding: 0; /* 有些主题会加内边距模拟边框间隙，一起清掉 */
    outline: none; /* 避免聚焦时出现的边框 */
    box-shadow: none; /* 部分主题用阴影代替实边框，也一起移除 */
  }
  

  如果你不想用!important，可以给选择器加个父级提高优先级，比如body .wp-block-gallery .wp-block-image img，这样更符合CSS规范。

• 适配经典编辑器的旧版图库
  如果你用的是老版经典编辑器创建的图库，用这个选择器：

  /* 移除经典编辑器图库缩略图的边框 */
  .gallery-item img {
    border: none;
    box-shadow: none;
  }
  

• 自己定位精准样式（终极方案）
  要是上面的代码还是没用，大概率是主题的样式优先级更高，教你自己找准确的选择器：

  1. 右键点击带边框的缩略图，选择「检查」（Chrome/Firefox都支持）
  2. 在开发者工具的「Elements」面板里找到对应的<img>标签
  3. 看右侧「Styles」面板，找到带border属性的生效规则，把它的选择器抄下来
  4. 在自定义CSS里用同样的选择器（或者加个父级）来覆盖原样式

内容的提问来源于stack exchange，提问作者harvester