Javascript不继承样式答案

【问题标题】：Javascript not inheriting styleJavascript不继承样式
【发布时间】：2018-01-24 19:23:37
【问题描述】：

怎么了堆栈！我在公司网站上实施的 javascript 表单存在重大问题。问题是表单没有从样式表继承任何东西。我们所有的公司网站都是使用 wordpress 构建的。对于这个特定的网站，我们使用带有子主题的 divi 主题进行自定义。我有他们在 ftp 上调用的所有 javascript 文件和 php 文件，并且表单本身工作得很好，但它在视觉上完全是一团糟。我最终在另一个没有 divi 的测试环境中设置了相同的表单，并且表单最终被设计为与正在使用的不同主题相匹配。所以我知道问题出在 divi 上，但是有没有人对如何在仍然使用 divi 的同时获得这种形式的样式有任何建议？

这里是相关网站的 URL：http://www.haines.com/university/

在选择课程下，当您单击任何课程中的日期链接时，将打开表单。

【问题讨论】：

Broken Javascript Form Pic - 应该是Broken JavaScript in post（在帖子中包含您的代码，而不是图片）。
代码不是坏的。代码工作正常，但 Divi 阻止了表单的样式。因此无需发布表单的代码。该表单在任何其他 wordpress 主题中都可以很好地设置样式，除了 Divi。
A url or form + css sn-p 会帮你得到答案，不能修复我们看不到的东西
我在问题中添加了指向该站点的链接。我希望这会有所帮助！
欢迎来到 StackOverflow。 有关使用该网站的一些提示：您应该已经研究过您的问题并包括您尝试解决它的方法，包括Minimal, Complete & Verifiable example。请re-read the Stack Overflow tour，然后阅读How much research effort is expected of Stack Overflow users和How to ask a good question

标签： javascript php wordpress styles wordpress-theming

【解决方案1】：

好的，这里发生了一些事情。我看到您仍在积极更改代码，因此目前可能并非全部适用。

首先，您正在重复使用 ID。你不能那样做； id 是唯一的，如果不是，则会导致问题。将 studentclasssignup 改为一个类。

其次，当您想要输入样式时，您将 css 放在 div 上。你想要 div 的孩子的 css。如果您更改为班级，您可以像这样设置孩子的样式：

.studentclasssignup > input { <whatever> }

或者有一个 id 它会是：

#studentclasssignup > input { <whatever> }

但同样，不要重复使用 ID。

【讨论】：

老兄，非常感谢。一旦你这么说，它就为我点击了，我能够弄清楚如何在我的自定义 css 表单中设置类。我现在正在为这个吸盘设计风格！谢谢！

【解决方案2】：

据我所知，您的模板在其 CSS 中使用了动态类。例如：

.hs-form-c0074a25-1641-462d-8731-7da7bc52f872_06f8c9b0-accf-40a3-a90d-65b583641897 .hs-button{
    border:none;
    font-family:Helvetica,Arial,sans-serif;
}

这意味着你不能重复使用他们的风格，除非你知道如何检索这种 id。

在这种情况下，最简单的方法应该是复制/粘贴您想要的 CSS，然后将其应用到您的表单中：

.registercontainer button {
    border:none;
    font-family:Helvetica,Arial,sans-serif;
}

这应该针对您需要的每种样式（输入、标签等）完成

【讨论】：