子页面的不同 CSS 文件答案

【问题标题】：Different CSS files for childpages子页面的不同 CSS 文件
【发布时间】：2012-02-15 13:26:52
【问题描述】：

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

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

谢谢

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

【问题讨论】：

标签： java css jsp spring-mvc jstl

【解决方案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; }

【讨论】：

【解决方案2】：

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

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

您的控制器将返回 order.jsp 作为视图，作为模型将返回一个订单，在您的主 jsp (order.jsp) 中包含该信息，现在您可以看到要显示的内容并构建在您的 head 标签中相应地添加 css 标签。

希望这会有所帮助！

【讨论】：