Ссылка на metro css и jade

Question

У меня есть html-код в jade, но мне трудно понять, как свойство body установлено из jade в css. Я не мог видеть тег тела в файле css.

Мой 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? где я его найду?

Thankks заранее

Answer 1

Запустите приложение, откройте его в браузере и воспитывать инструменты разработчика в вашем браузере (обычно с F12 на большинстве браузеров) перейти к HTML-элемента или вкладки и перемещаться выберите тело (как показано ниже):

Как вы видите на правой панели, есть список всех тегов/класса/ид с их соответствующими стилями. Поэтому вам нужно искать body.metro или .metro, чтобы найти его стили. и как только вы его найдете, вы увидите, что это имя файла (написанное синим цветом в правой части), а его номер строки, если вы нажмете на него, переходит непосредственно к этому фрагменту кода css.

Если вы используете хром это будет выглядеть так: