如何将HTML/CSS修改保存至Chrome，使网页始终显示修改后效果？

方法1：用Stylus插件添加自定义CSS（推荐，操作简单） #

• 在Chrome扩展商店搜索并安装Stylus插件
• 打开需要修改的网页，点击浏览器右上角的Stylus图标，选择「为此网站编写样式」
• 在弹出的代码编辑器中，写入针对目标元素的隐藏样式。比如你通过F12找到元素的class是promo-banner，就写：

.promo-banner {
    display: none !important;
}

• 点击保存，之后每次打开该网页，这个元素都会自动被隐藏。如果要找更精准的选择器，可以在Elements面板右键元素，选择「复制」→「复制选择器」。

方法2：用Tampermonkey编写用户脚本（适合更复杂的场景） #

• 在Chrome扩展商店搜索并安装Tampermonkey插件
• 点击插件图标，选择「创建新脚本」
• 替换默认代码为以下内容，根据你的需求修改参数：

// ==UserScript==
// @name         自动隐藏指定网页元素
// @version      0.1
// @description  永久隐藏目标网页的特定元素
// @match        https://你的目标网页域名/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    // 替换成你复制的元素选择器
    const element = document.querySelector('#annoying-popup');
    if (element) {
        element.remove(); // 直接移除元素，也可以用element.style.display = 'none'隐藏
    }
})();

• 修改@match里的网址为目标网页的完整域名（比如https://example.com/*匹配该域名下所有页面），替换querySelector里的选择器为你从Elements面板复制的内容，保存脚本即可。

提示：如果元素是动态加载的，用户脚本里可以用setInterval监听元素是否出现，比如：

const checkInterval = setInterval(() => {
    const element = document.querySelector('#dynamic-element');
    if (element) {
        element.remove();
        clearInterval(checkInterval);
    }
}, 500);

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