扩展Wordpress的CSS -主题

Question

从3天开始，我尝试将我的自定义CSS添加到现有的Wordpress主题中。为此，我使用Child-Theme-Configurator (http://www.childthemeconfigurator.com/)创建了一个子主题。基本上，它工作得很好。但仍然有一些CSS不一致，我不能删除。我的子主题CSS似乎被父主题CSS覆盖了(即错误的边框，边距，...)我试着让它在不同的主题下工作。但每个主题都会导致类似(但略有不同)的问题。

我只需要在文章中使用我的自定义css，因为我只在文章中嵌入了我的html。所以我的问题基本上是:有没有办法确保在html-post中100%禁用/重置parent- to css？

Answer 1

覆盖主题CSS是出了名的困难。

浏览器DevTools是您的朋友。右键单击样式错误的项目，然后单击检查。然后查看该项目的CSS。

你必须弄清楚如何让你的重写选择器在某种程度上比主题中的选择器更具体，这样浏览器就会接受它们。

例如，假设你想减少文章中段落的下边距。假设主题样式是这样的

  p { margin:0 0 10px;}

如果你只是把这个放进去，它不会起作用的。

  p { margin:0 0 6px;}  /* no good */

如果你把这个放进去，你可能会弄乱其他各种样式。

  p { margin:0 0 6px !important;}  /* no good */

但是如果你把它放进去，你就得到了一个比主题样式表中的选择器更具体的选择器。

  body article.post p { margin:0 0 6px;}  

DevTools inspect功能允许您查看项目的样式，以便您可以确定如何覆盖它们的样式。在不同的主题中，你需要重写的确切样式。

Answer 2

打开cpanel / FTP客户端并转到wp-content/themes/your theme/您应该会看到一个style.css文件，这取决于您使用的主题，但大多数情况下都存在，您只需打开并编辑它