子页面的不同 CSS 文件

Question

我正在开发一个 spring mvc Web 应用程序，对于前端，我使用 JSP 文件。为了实现出色的动态页面，我使用 宽度不同的容器/子文件，并在顶级容器中定义了一些基本的 css。为了创建干净的 html 输出，我从子文件中删除了 和 标签，但没有 标签 我无法为我的子页面定义不同的或更精致的 css 文件。

为子页面实现不同的 css 的最佳方法是什么？

thx

PS：我能想到的唯一方法是使用javascript并将css文件加载到head标签中。

Answer 1

不需要多个子 css 文件的另一个选项是将类或 ID 附加到 body 标记。

然后，您可以像这样覆盖属性（愚蠢的示例）：

//default style     
div#container { background: red;}

//child 1
.body_class_1 div#container { background: blue;}

//child 2
.body_class_2 div#container { background: green; }

Answer 2

恕我直言，您最好的选择是使用一些简单的抽象从控制器返回的模型中派生您的 css。假设您有一个订单页面，并且订单有许多订单项，并且需要执行一些操作命令。

所以你有一个名为 order.jsp 的视图，这个视图由另外 2 个子页面 orderitems.jsp 和 orderactions.jsp 组成，那么你可以有由许多 orderitem.jsp 组成的 orderitems.jsp 和由许多 orderaction.jsp 组成的 orderactions.jsp （作为额外的考虑因素，我建议您使用标记文件而不是子 jsp，但这可能只是风格问题）。

您的控制器将返回 order.jsp 作为视图，模型将返回订单，通过主 jsp (order.jsp) 中的信息，现在您可以看到要显示的内容并相应地构建 css 标签在你的头标签中。

希望这有帮助！