html - 为什么我的 CSS 样式没有被应用？

Question

我有这个 html:

<p>
    <span class="fancify">Parting is such sweet sorrow!</span><span> - Bill Rattleandrollspeer</span>
</p>

...和这个 css(添加到 Site.css 的底部):

.fancify {
    font-size: 1.5em;
    font-weight: 800;
    font-family: Consolas, "Segoe UI", Calibri, sans-serif;
    font-style: italic;
}

所以，我希望引语(“离别是如此甜蜜的悲伤!”)是斜体的，并且使用与被引述者的名字(Bill Rattleandrollspeer)不同的字体，因为它的 span 标签有类“fancify”附加到它。该类当然应该可见，因为它所在的文件引用了使用 Site.css 文件的布局文件。

我现在犯了什么菜鸟错误？

更新

我认为问题可能在于我在 Site.css 中添加了该文件中此部分之后的新类:

/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {

...但是我把它移到了上面，但它仍然无法正常工作，而且通过 F12 也看不到 |检查元素中有问题的标签。

我将对 Site.css 的引用移到 bootstrap.css 文件下方，这确实改变了该文本的外观，但仍然没有斜体，并且在元素检查器中仍然看不到...

更新 2

以下是 HTML 的生成方式:

<p>
    <span>
        <label class="fancify">Parting is such sweet sorrow!</label>

...这是我在 Site.css 中的 css 规则:

p span label .fancify {
        font-size: 1.5em;
        font-weight: 800;
        font-family: Consolas, "Segoe UI", Calibri, sans-serif;
        font-style: italic;
        display: inline;
    }

...但它没有被识别。我认为这是对 css/html 协议(protocol)的破坏，应该由某个世界机构来裁决。再一次，我可能在某个地方犯了一些愚蠢的错误。

Answer 1

CSS 文件中的早期错误可能导致您的(正确的)CSS 无法工作。