跳到主要内容

整站变黑白

· 阅读需 2 分钟

一行代码，让整站变黑白。

要实现整个 WordPress 网站变成黑白效果，可以通过添加自定义的 CSS 样式来实现。使用 CSS 的 filter 属性可以很容易地将页面的所有颜色转换为黑白。具体步骤如下：

1. 添加自定义 CSS​

方法一：通过主题的自定义 CSS​

你可以直接在 WordPress 管理后台的 外观 > 自定义 > 额外 CSS 中添加以下 CSS 代码：

html {
    filter: grayscale(100%);
}

方法二：通过子主题的 CSS 文件​

如果你使用子主题并希望将这个效果添加到子主题中，请按照以下步骤操作：

  1. 打开你的子主题目录。
  2. 找到 style.css 文件并打开它。如果没有这个文件，可以创建一个。
  3. 在 style.css 文件中添加以下代码：
html {
    filter: grayscale(100%);
}

2. 确保 CSS 加载​

如果你选择通过子主题的 style.css 文件添加 CSS，需要确保这个文件被正确加载。请检查你的 functions.php 文件，确保它包含类似以下的代码：

function child_theme_enqueue_styles() {
    // Enqueue parent theme style
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
    
    // Enqueue child theme style
    wp_enqueue_style('child-style', get_stylesheet_uri(), array('parent-style'));
}

add_action('wp_enqueue_scripts', 'child_theme_enqueue_styles');