Question

我一直在使用的wordpress主题一直在表现，所以我正在尝试使用样式表编辑我的网站（我有0次使用html或CSS的经验）。我发现谷歌搜索过程发现选择器名称我必须用来编辑我的网站中的每个元素非常耗时，所以我开始查看源代码，尝试识别我需要的选择器。

对于下面的示例，我正在寻找更改注册表单按钮的背景颜色。

<div class="notif">
            <!-- Begin MailChimp Signup Form -->
            <div id="mc_embed_signup_appstage">
                <form action="http://HUDKingPro.us7.list-manage.com/subscribe/post?u=0c2c35acf6b36619d521176a9&id=8d4d76b2db" method="post" id="mc-embedded-subscribe-form_appstage" name="mc-embedded-subscribe-form" class="validate" target="_blank">
                                                    <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL_appstage" placeholder="Enter your email address" required />
                            <input type="submit" value="Notify me !" name="subscribe" id="mc-embedded-subscribe_appstage" class="button" />

到目前为止，使用我已经确定的选择器我已经提出了这个，但它似乎不起作用，是否有一种从HTML源代码中识别CSS选择器的方法？

#notif input {
background: #1A1A18;
}

道歉，如果这是过于天真，我有一个应用程序将在下周发布，所以我没有足够的时间来深入了解CSS。

Answer 1

您是否尝试使用按钮所具有的课程？即.button

所以它会是：

.notif .button {
    background: #1A1A18;
}

您的div已<div class="notif">因此您的CSS无效# 您使用.表示课程，#表示ID。

修改

正在使用此样式表http://hudkingpro.com/wp-content/themes/apptamin-a-hor/yourstyles-example4.css

按第76行或以下方式编辑背景颜色：

这是您要编辑的课程或输入：

.notif input#mc-embedded-subscribe_appstage{ background: #1A1A18 !important; }

将上述内容添加到外观 - 编辑器中。

Answer 2

#用于ID，而您有class="notif"。此外，没有进一步的限制，它将影响电子邮件输入和提交按钮。

请尝试.notif input[type=submit]

如何从我的HTML源代码中确定要使用的CSS选择器？

2 个答案: