更改 wordpress 主题中元素的字体颜色答案

【问题标题】：Changing font color of an element in wordpress theme更改 wordpress 主题中元素的字体颜色
【发布时间】：2014-03-12 03:11:46
【问题描述】：

我是 Wordpress 和 CSS 的新手。我最近购买了一个wordpresstheme

我创建了一个website，我想更改网站中某些元素的颜色。例如，在“机会”菜单项下，有一张图片写着“EMC 客户的潜力”，下面的行是灰色的，几乎无法阅读。

所以我想改变颜色。主题选项允许我使用自定义 CSS..

我使用的代码是：

media="all"
.white-overlay p {
padding: 5px 0 15px;
font-size: 15px;
color: #a81800;
}

当我尝试将代码添加到 wp-content/themes/vernum 下的 stle.css 时（我正在使用 FTP 访问此文件），我看到：

/* 主题名称：Vernum - 响应式一页视差模板主题 URI：http://spyropress.com/themes/vernum 添加一名作者作者 URI：http://spyropress.com/ 说明： Vernum是春天的一个项目，欢乐的单页网站。它现代而干净，非常容易编辑。它准备与 jquery 视差效应一起使用。有平面和简单的图形。它是多用途的，因此您可以将其用作投资组合或个人页面，无论您想要什么…… 版本：1.8.2 许可：WordPress 主题由两部分组成：(1) PHP 代码与 WordPress 本身一样，都在 GPL 许可下获得许可。您将在与此文本文件相同的目录中找到许可证文本的副本。或者您可以在这里阅读：http://codex.wordpress.org/GPL (2) 主题的所有其他部分，包括但不限于 CSS 代码、图像和设计，均根据购买的许可证进行授权。在此处阅读许可详情：

http://wiki.envato.com/support/legal-terms/licensing-terms/
License URI: license.txt
Tags: agency, clean, easy to use, flat, minimal, modern, multipurpose, one page, parallax, portfolio, responsive, retina, simple, spring, spyropress, builder
Text Domain: spyropress
*/


.wp-caption { }
.wp-caption-text { }
.sticky { }
.gallery-caption { }
.bypostauthor { }
.alignright { }
.aligncenter { }
.alignleft { }

所以我不确定我应该在哪里添加代码但它不会改变颜色！有人能帮我调查一下吗……我已经为此苦苦挣扎了好几个小时:(

【问题讨论】：

只需删除 media="all" 部分（您的自定义 css 的第一行），它应该可以工作。
你为什么有media="all"。

标签： css wordpress wordpress-theming

【解决方案1】：

这里不需要media="all"，所以删除它：

.white-overlay p {
    padding: 5px 0 15px;
    font-size: 15px;
    color: #a81800;
}

【讨论】：

您好，我尝试将此代码添加到屏幕截图中显示的窗口中。但它不会改变任何内容。不知道是不是wordpress主题问题
@bob_d 尝试将代码直接添加到主题的 style.css 文件中，而不是像现在这样通过管理面板添加代码
你知道wordpress中的style.css文件在哪里吗？正如我提到的，我对环境很陌生
@bob_d 你可以进去wp-content/themes/your-theme-name/style.css
@bob_d 只需在文件末尾添加

【解决方案2】：

如果您只想更改下方文本的颜色，那么只需在您的自定义 css 中插入以下内容：

.white-overlay p {
    color: #a81800;
}

这将保留所有其他属性（字体大小和填充），因为它们最初在主 CSS 文件中指定。您不应该将 media="all" 放在 CSS 中，因为：

这是多余的；除非另有说明，否则浏览器将假定一个规则适用于所有媒体类型。
语法实际上是这样格式化的：

@media [媒体类型] { [选择器] { [属性]: [值]; }

如果您想让透明叠加层变得不那么透明，您还可以添加以下代码：

.white-overlay {
    background: rgba(255, 255, 255, 0.6);
}

background 值中的最后一个数字指定不透明度（从 0 到 1），我已将其从 0.5 更改为 0.6。

【讨论】：

我不知道为什么即使将此代码添加到我的浏览器后，它也不会改变显示
我建议您简单地将其添加到您的自定义 CSS 文件中。如果您对结果不满意，您可以随时将其取出或调整。

【解决方案3】：

我在 Vernum Wordpress 主题中遇到了同样的问题。由于某种原因（我无法理解），他们 style.css 没有“正确”链接。我通过在子主题文件夹中添加父主题的 header.php 副本并添加以下行来解决该问题：

<head>
    <?php wp_head(); ?>
   <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css"     media="screen" />

</head>

这似乎为 style.css 提供了正确的可见性，因此它可以被子主题覆盖。请注意，我目前遇到了 Vernum 主题的其他问题，涉及使用多个样式表，因此它似乎不是尝试和重新设置样式的理想主题。

祝你好运乔瓦尼

【讨论】：