CSS 加载但更改未生效?

问题描述 投票:0回答:1

所以基本上我有一个在 2012 年服务器上运行的 server.js 文件,该文件为公共子文件夹中的静态 html css 和 js 文件提供服务。我写的原始CSS适用于需要的页面以及html和js(包括api)。出于某种原因,当我进行基本更改只是为了查看更改是否确实发生时,例如设置背景颜色:红色;在我的#body{yada yada}中,但什么也没发生。我已经尝试过 ctrl+f5 并在 2012 服务器命令提示符下尝试过 ctrl+c 来重新启动节点服务器。对于已完成 80% 的项目来说,这似乎是一个非常简单的问题。

     <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Timecard</title>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        <div id="body">
            <nav class="navbar">
                <a href="http://ip placeholder/">
                    <img src="./company.png" alt="Company Logo" class="logo">
                </a>
            
                <div id="date"></div>
                <div class="links">
                    <a href="/timecard-manager">Time Card Manager</a>
                </div>
            </nav>
            <div id="maincontent1">
                <div id="alphabetLinks"></div>
            </div>
            <div class="grid-container">
                <div class="row">
                    <div class="grid-item" style="font-weight: bolder; font-size: large; 
    text-align: center;">EMPLOYEE</div>
                    <div class="grid-item" style="font-weight: bolder; font-size: large; 
    text-align: center;">TODAY'S ATTENDANCE</div>
                <div class="grid-item" style="font-weight: bolder; font-size: large; text- 
   align: center;">SUMMARY</div>
            </div>
            <div class="row">
                <div class="grid-item" id="employeeList">Employees will be listed here... 
     </div>
                <div class="grid-item">Item 5 with text.</div>
                <div class="grid-item">Item 6 with a lot of text to see how it expands. 
    </div>
            </div>
        </div>
        <br></br>
        <div id="maincontent3">
            <table>
                <tr id="tr3">
                    <td colspan="3">
                        <label id="clocktext" for="employee">Clock:</label>
                        <select name="employee" id="employee">
                          <option value="In">In</option>
                          <option value="Out">Out</option>
                          <option value="Personal">Personal</option>
                          <option value="Lunch in">Lunch in</option>
                          <option value="Lunch out">Lunch out</option>
                        </select>   
                        <br>
                        <label for="memo">Memo:</label>
                        <input id="memo" placeholder="Memo"><br>
                        <label for="password">Password:</label>
                        <input type="password" id="password" placeholder="Password">
                        <button class="btn btn-primary" id="button">ENTER</button>
                    </td>
                </tr>
            </table>
        </div>
        </div>
        <script src="app.js"></script>
        <br>
        <p>new content added here</p>
    </body>
    </html>
html css node.js
1个回答
0
投票

在您的开发者工具 (F12) -> Network 选项卡中,您能否确认您的 CSS 已加载,并且版本正确?还有一个小复选框“禁用缓存”,您可以尝试一下。也许有帮助=)

© www.soinside.com 2019 - 2024. All rights reserved.