0

我正在开发一个由其他人构建的 WordPress 网站，目前我正在尝试设置页脚的样式并且遇到了一些问题。

首先，它不会通过选择标签中的任何 div 来让我的样式，只有当我直接选择 html 元素（footer [role=contentinfo] p {...}）时它才会起作用，甚至这个参差不齐。

任何人都可以提供一些指导吗？这是页脚代码

  <?php
/**
 * The template for displaying the footer.
 *
 * Contains footer content and the closing of the
 * #main and #page div elements.
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */
?>
    </div><!-- #main .wrapper -->
    <footer id="colophon" role="contentinfo">
        <div class="footer-links">
            <ul>
                <li>About</li>
                <li>About JoeStick</li>
                <li>Our Products</li>
                <li>FAQs</li>
            </ul>
        </div>
        <div class="site-info">
            <p>YOU MUST BE OVER THE AGE OF 18 YEARS TO BUY AND OR USE ANY SOUTH BEACH SMOKE PRODUCT. Nicotine is a highly addictive
            substance derived from the tobacco plant. Our products do not treat, diagnose, or cure any disease, physical ailment, or
            condition. If you are allergic to nicotene or any combination or inhalents, if you are pregnant or breast-feeding, or if
            you have a heart condition, diabetes, high blood pressure or asthma, consult your physician before using South Beach Smoke
            nicotene products. Just like traditional tobacco cigarettes, South Beach Smoke Electronic Cegiarettes are not approved by
            the American FDA.</p>
        </div><!-- .site-info -->
        <div class="footer-nav">
            <ol>
                <li>Copyright &copy; 2013 SmokeSafely.com</li>
                <li>Terms and Conditions</li>
                <li>Warnings</li>
                <li>Privacy Policy</li>
                <li>Contact</li>
            </ol>
        </div>
    </footer><!-- #colophon -->
</div><!-- #page -->

<?php wp_footer(); ?>
</body>
</html>

这是我正在尝试使用的 CSS

/* Footer */
}
footer[role="contentinfo"] {
    background-color: #082448;
    color: white;
    border-top: 1px solid #ededed;
    font-size: 12px;
    line-height: 2;
    margin-left: auto;
    margin-right: auto;
}
footer[role="contentinfo"] a {
    color: #686868;
}
footer[role="contentinfo"] a:hover {
    color: #21759b;
}
footer[role="contentinfo"] ul {
    width: 30%;
    float: left;
}
footer[role="contentinfo"] p {
    width: 65%;
    height: 30%;
    float: left;
    font-size: 10px;
}
footer[role="contentinfo"] ol {
    width: 100%;
    height: 5%;
    float: none;
}
footer[role="contentinfo"] ol li {
    float: left;
    display: inline;
}

目前我正在努力解决的主要问题是页脚上的背景颜色显示不正确。再次，非常感谢任何帮助。

4

1 回答 1

0

选择带有 id 的页脚标签：

#colophon {background-color:red;}

...或任何你想要它改变的东西。

有时 wordpress 会覆盖这些规则，所以我使用（我知道，我确信这是一种可怕的做法，但它可以完成工作。）

#colophon {background-color:red !important;}

然后要抓取文档的某些部分，您可以使用子选择器。

#colophon > div > ul > li {background-color:red;}

我希望这有帮助！

于 2013-09-25T18:17:51.307 回答