css - 如何将CSS添加到Vaadin/Maven元素中？

Question

存在关于如何将 css 添加到 Vaadin 元素的 a question at SO。那里的提示是在 /WEB-INF/VAADIN/themes/ 位置添加 css。

我的问题是 Vaadin 元素通常在 WebContent 下有 WEB-INF 文件夹，而现在在 Maven 上类似的文件夹在 webapp 下。这似乎是我的 css 更改没有生效的原因。

此外，是否需要将自定义 css 与原始 css 放在相同的子结构 中？我想修改table css，不知道css是否需要在特定路径下。

那么如何为表格添加 css 以便表格也发生变化，而不仅仅是代码构建正确？ :)

更新 1:我可以用 Firebug 得到以下模板，但这是我得到的最接近浏览器的东西。

< link rel="stylesheet" type="text/css" href="/html/VAADIN/themes/mytheme/styles.css" >
< html >
< head >
< title > < /title >
< /head >

< body onload="javascript:location.replace('/c')" >
< !--The numbers below are used to fill up space so that this works properly in IE. See http://support.microsoft.com/default.aspx?scid=kb;en-us;Q294807 for more information on why this is necessary.
12345678901234567890123456789012345678901234567890123456789012345678901234567890
12345678901234567890123456789012345678901234567890123456789012345678901234567890
12345678901234567890123456789012345678901234567890123456789012345678901234567890
-- >
< /body >
< /html >
< /link >

Answer 1

您可能会将 styles.css 文件放在 src/main/webapp/VAADIN/themes/[yourtheme]/ 文件夹中，并配置 Maven 以复制 src/main/中的所有内容webapp 到您的 WEB-INF。这样，您的 .css 文件将在 WEB-INF/VAADIN/themes/[yourtheme]/ 中结束。

强烈建议从主题继承而不是试图覆盖默认主题的行为。

然后你需要在应用中指定你的主题名称

public void init()
{
    setTheme("simplegae");
    ...

并使您的 .css 文件继承自主题的 css(runo、reindeer 等)。

@import "../reindeer/styles.css";

我最近发布了一个使用 Maven 的示例 Vaadin 应用程序，可在 this address 访问。 .它的目的是在 GAE 上工作，但您可以从 SVN 中检查它并看看我做了什么:

svn co http://code.google.com/p/tinywebgears-samples/source/browse/trunk/simplegae/ simplegae