仅当放在特定样式表中时才应用CSS

Question

For some reason, when I put this CSS code into about.css it works, but when I put it in the theme.css it doesn't work. 由于某种原因，当我将此CSS代码放入about.css它可以工作，但是当我将其放入theme.css ，则无法工作。

CSS code that's not working: 无法使用的CSS代码：

.photo-credits p {
    font-size: 13px;
    font-family: 'PT Sans', 'Archivo Narrow', sans-serif;
    font-style: italic;
    color: #FDFF33;
    text-align: right;
    margin: 0;
    padding-bottom: 10px;
}

HTML: HTML：

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Paintball</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--Styling--->
    <link type="text/css" rel="stylesheet" href="../css/theme.css" />
    <!--Page Styling-->
    <link type="text/css" rel="stylesheet" href="../css/about.css" />
    <!--Google fonts-->
    <link href="https://fonts.googleapis.com/css?family=Archivo+Narrow:400,400" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=PT+Sans:400,400i" rel="stylesheet"> </head>

<body>
    <?php include("../html/navbar.php"); ?>
        <div class="container">
            <div class="title">Paintball </div>
        </div>
        <footer class="photo-credits">
            <p>PC: Name</p>
        </footer>
</body>

</html>

I don't understand why b/c as you can see on the JSFiddle, if I put the css from about.css and theme.css in one css file it works. 我不明白为什么在JSFiddle上可以看到b / c，如果我将about.css和theme.css中的css放在一个css文件中就可以了。

This has happened before (where it works when I paste all my CSS in JSFiddle) and it's really frustrating b/c I don't want to repeat code, but it seems that I may have to. 这是以前发生的（当我将所有CSS粘贴到JSFiddle时可以工作的地方），确实让我很沮丧，因为我不想重复代码，但似乎必须这样做。 Any advice on this would be really appreciated! 任何建议对此将不胜感激！

PS: I almost think it might be MAMP and maybe refreshing on Chrome. PS：我几乎认为这可能是MAMP，甚至可能在Chrome上令人耳目一新。 B/c I had another incident, where I unlinked the stylesheet, saved on Brackets, refreshed Chrome, then linked the stylesheet again, saved on Brackets, and refreshed on Chrome, and then suddenly the CSS I had added was applied. B / c我遇到另一件事，我取消链接样式表，保存在Brackets中，刷新了Chrome，然后再次链接了样式表，保存在Brackets中，然后在Chrome上刷新，然后突然应用了我添加的CSS。

Using: 使用：

MAMP MAMP
PHP 5 PHP 5
Brackets text editor 括号文字编辑器

 /*theme.css*/ body { font-family: 'Archivo Narrow', sans-serif; text-transform: uppercase; background-color: #0C0F0A; color: #F0F7F4; margin: 0; font-size: 48px; } .navbar { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #0C0F0A; position: absolute; top: 0; width: 100%; } .navbar li { float: left; } .navbar li a { display: block; color: #F0F7F4; text-align: center; padding: 14px 16px; text-decoration: none; } .navbar li a:hover { background-color: #F0F7F4; color: #0C0F0A; } .container { margin-top: 82px; } .photo-credits p { font-size: 13px; font-family: 'PT Sans', 'Archivo Narrow', sans-serif; font-style: italic; color: #FDFF33; text-align: right; margin: 0; padding-bottom: 10px; } /*about.css*/ html { height: 100%; } .container { background-repeat: no-repeat; background-size: cover; background-position: center center; background-image: url('../images/Team%20Winter.png'); } .title { height: 100%; font-size: 550%; text-align: center; color: #F0F7F4; }

 <!DOCTYPE html> <html lang="en"> <head> <title>Paintball</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!--Styling---> <link type="text/css" rel="stylesheet" href="../css/theme.css" /> <!--Page Styling--> <link type="text/css" rel="stylesheet" href="../css/about.css" /> <!--Google fonts--> <link href="https://fonts.googleapis.com/css?family=Archivo+Narrow:400,400" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=PT+Sans:400,400i" rel="stylesheet"> </head> <body> <?php include("../html/navbar.php"); ?> <div class="container"> <div class="title">Paintball </div> </div> <footer class="photo-credits"> <p>PC: Name</p> </footer> </body> </html>

Answer 1

Actually nvm! 其实是nvm！ I realized the culprit was Chrome. 我意识到罪魁祸首是Chrome。 Pressing shift + command + R refreshed the page and then my CSS styling was applied 按shift + command + R刷新页面，然后应用我的CSS样式

仅当放在特定样式表中时才应用CSS

问题描述

CSS code that's not working: 无法使用的CSS代码：

HTML: HTML：

Using: 使用：

1 个解决方案

解决方案1
0 2017-02-05 16:03:02

仅当放在特定样式表中时才应用CSS

问题描述

CSS code that's not working: 无法使用的CSS代码：

HTML: HTML：

Using: 使用：

1 个解决方案

解决方案1 0 2017-02-05 16:03:02

解决方案1
0 2017-02-05 16:03:02