Question

我网站上的路线很少，而且我的所有网页都使用相同的布局和链接样式。

例如，在路线/或/abc或/other中，我的布局和样式效果很好。但是，如果我加载路由/other/abc，我的布局仍然有效，但我的样式不会加载。

以下是一些代码：

我的layout：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Express MVC Example</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
   <ul class="menu">
     <li><a href="/">home</a></li>
     ...
     <li><a href="/other/abc">other/abc</a></li>
   </ul>

    {{{ body }}}

</body>
</html>

这是我的other路线controllers：

import express from 'express'

export default (app) => {
  const api = express.Router();

  api.get('/', (req, res) => {
    console.log('client connected');
    res.render('other/main');
  });

  api.get('/abc', (req, res) => {
    res.render('other/abc');
  });

  return api
}

我将handlebars用于views。

Answer 1

问题在于你如何在html中指定style.css链接，我想这会解决它：

<link rel="stylesheet" href="/style.css">

如果这不起作用，请查看此链接Relative path in HTML（实际上您应该查看它）

样式在嵌套路由

1 个答案: