Question

我正在使用节点js w express和jade 即使改变了CSS和布局，我也无法让我的计算器看起来只有淡淡的颜色。我不确定我是否应该编辑css文件或另一个

index.jade

    extends layout

block content
  h1= title
 p Welcome to #{title}
  p hello this is my calculator
  form(name='Calc')
   table(border='4')
    tr
      td
        input(type='text', name='Input', size='22')
        br
    tr
      td
            input(type='button', name='one', value='  1  ', onclick='Calc.Input.value +=       \'1\'')
        input(type='button', name='two', value='  2  ', onclick='Calc.Input.value += \'2\'')
        input(type='button', name='three', value='  3  ', onclick='Calc.Input.value += \'3\'')
        input(type='button', name='plus', value='  +  ', onclick='Calc.Input.value += \' + \'')
        br
        input(type='button', name='four', value='  4  ', onclick='Calc.Input.value += \'4\'')
        input(type='button', name='five', value='  5  ', onclick='Calc.Input.value += \'5\'')
        input(type='button', name='six', value='  6  ', onclick='Calc.Input.value += \'6\'')
        input(type='button', name='minus', value='  -  ', onclick='Calc.Input.value += \' - \'')
        br
        input(type='button', name='seven', value='  7  ', onclick='Calc.Input.value += \'7\'')
        input(type='button', name='eight', value='  8  ', onclick='Calc.Input.value += \'8\'')
        input(type='button', name='nine', value='  9  ', onclick='Calc.Input.value += \'9\'')
        input(type='button', name='times', value='  x  ', onclick='Calc.Input.value += \' * \'')
        br
        input(type='button', name='clear', value='  c  ', onclick='Calc.Input.value = \'\'')
        input(type='button', name='zero', value='  0  ', onclick='Calc.Input.value += \'0\'')
        input(type='button', name='DoIt', value='  =  ', onclick='Calc.Input.value = eval(Calc.Input.value)')
        input(type='button', name='div', value='  /  ', onclick='Calc.Input.value += \' / \'')
        br

layout.jade

    doctype html
html
  head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
 body
  block content

styles.css的

    body {
 font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
 a {
  color: #00b7ff;
 }

app.js

      var express = require('express');
    var routes = require('./routes');
      var user = require('./routes/user');
    var http = require('http');
     var path = require('path');

    var app = express();

   // all environments
   app.set('port', process.env.PORT || 3000);
   app.set('views', path.join(__dirname, 'views'));
    app.set('view engine', 'jade');
       app.use(express.favicon());
   app.use(express.logger('dev'));
   app.use(express.json());
    app.use(express.urlencoded());
  app.use(express.methodOverride());
   app.use(app.router);
     app.use(require('stylus').middleware(path.join(__dirname, 'public')));
    app.use(express.static(path.join(__dirname, 'public')));

       // development only
        if ('development' == app.get('env')) {
           app.use(express.errorHandler());
        }

         app.get('/', routes.index);
         app.get('/users', user.list);

             http.createServer(app).listen(app.get('port'), function(){
   console.log('Express server listening on port ' + app.get('port'));
    });

Answer 1

你的CSS样式'''标签，但我在你的HTML中没有看到任何链接。

为您的元素添加一个类，然后使用CSS为该类设置样式。

如何更改node.js计算器的颜色和外观？

1 个答案: