wordpress通过function.php文件添加自定义css样式代码

在 WordPress 中，你可以通过 functions.php 文件来添加自定义的 CSS 样式。要实现这个目的，可以使用 wp_enqueue_style 函数来引入一个外部的 CSS 文件，或者通过 wp_add_inline_style 来直接插入内联样式。以下是两种方法的示例：

1. 引入外部 CSS 文件

如果你有一个自定义的 CSS 文件，想要将其添加到主题中，可以按照以下步骤操作：

function custom_enqueue_styles() {
    // 引入自定义 CSS 文件，假设文件位于主题目录下的 css 文件夹中
    wp_enqueue_style('custom-style', get_template_directory_uri() . '/css/custom-style.css');
}
add_action('wp_enqueue_scripts', 'custom_enqueue_styles');

2. 插入内联 CSS 样式

如果你只想在 functions.php 中直接添加一些内联样式，可以使用 wp_add_inline_style 函数：

function custom_inline_styles() {
    $custom_css = "
        body {
            background-color: #f4f4f4;
        }
        .my-class {
            color: #333;
        }
    ";
    wp_add_inline_style('theme-style', $custom_css); // 这里 'theme-style' 是你主题的主样式句柄
}
add_action('wp_enqueue_scripts', 'custom_inline_styles');

解释

• wp_enqueue_style 用于引入外部 CSS 文件。get_template_directory_uri() 获取主题目录的 URL，wp_enqueue_scripts 是 WordPress 中用来加载脚本和样式的钩子。
• wp_add_inline_style 用于将自定义的 CSS 样式直接添加到页面中，theme-style 是你已经加载的样式句柄。

以上代码可以放在 functions.php 中，根据实际情况调整路径和 CSS 规则。

示例：