连接 Metro CSS 和 Jade答案

【问题标题】：Linking metro css and jade连接 Metro CSS 和 Jade
【发布时间】：2016-05-28 13:50:26
【问题描述】：

我有一个jade 中的html 代码，但我发现很难理解body 属性是如何从css 中的jade 设置的。我在 css 文件中看不到任何 body 标签。

我的html(玉)

html
 head
    link(rel='stylesheet', href='/control/css/metro-bootstrap.css')
    link(rel='stylesheet', href='/control/css/vcca.css')
    script(src="/control/js/jquery.min.js")

    // script(src='/control/js/metro.min.js')
    // script(src='/control/js/metro/metro-progressbar.js')
    //script(src="/socket.io/socket.io.js")
    //script.

    //var socket = io.connect(document.domain+':3000'); //'+port);
    script(src="https://cdn.socket.io/socket.io-1.0.0.js")
    script(src="/control/script.js")
    // script(src="/js/metro/metro-*.js")
 body.metro.vcca
    div.tile-area.tile-area-dark.text-center
        div.container
            h2.font1.fg-white Visualisation Centre
            br
            h3.font2.fg-white Please enter the 5 digit PIN
            input.font2.text-center.pininput(type='password')#pinInput
            div.container#numPad

body.metro.vcca 指的是什么？我应该在 css 文件中的哪里查找来了解 body 标签的属性？我需要改变身体的背景颜色。我怎样才能做到这一点？ h2.font1.fg-white 是什么意思？我在哪里可以找到它？

提前致谢

【问题讨论】：

标签： html css node.js pug metro-ui-css

【解决方案1】：

运行您的应用程序，在浏览器中打开它并在浏览器上调出开发人员工具（通常在大多数浏览器上使用 F12）转到 HTML 或元素选项卡并导航选择正文（如下所示）：

正如您在右侧面板中看到的，有一个包含所有标签/类/ID 及其相关样式的列表。所以你需要寻找 body.metro 或 .metro 来找到它的样式。一旦你找到它，你可以看到它的文件名（在右侧用蓝色写成）和它的行号，如果你点击它，就会直接进入那段 css 代码。

如果您使用的是 chrome，它会是这样的：

【讨论】：