wicket父子页面中的css规则继承

发布于 2024-12-07 12:40:45 字数 783 浏览 1 评论 0原文

我在解决 wicket 父子页面中的 css 类时遇到问题。

我有一个 wicket 基页 (BasePage) 和一个扩展 BasePage 的子页 (ChildPage)。

BasePage 中的 div 就像,

<div class="container-fluid">
    <wicket:child/>
</div>  

在我的基页 css 中的 ChildPage 中,

<wicket:extend>
       <div class="sidebar">
          ..........
       </div> 
 </wicket:extend>

我包含了一个 css 文件,其中有一个 css 规则,例如

.container-fluid > .sidebar {
  float: left;
  width: 220px;
}

div container-fluid 位于 BasePage 和 sidebar< /code> ChildPage 中的 div。问题是 渲染子页面后,找不到侧边栏类,页面无法正常显示。但是如果你把侧边栏类CSS放在ChildPage中,它就可以工作。但如果我必须专门放置所有子CSS,那么将来这将是一项混乱的工作,因为子页面很多并且CSS将是多余的。

有什么线索吗?

I have a problem resolving css classes in wicket parent child pages.

I have a wicket base page (BasePage) and a child page (ChildPage) extending BasePage.

The div in BasePage is like,

<div class="container-fluid">
    <wicket:child/>
</div>  

and in ChildPage

<wicket:extend>
       <div class="sidebar">
          ..........
       </div> 
 </wicket:extend>

in my base page css I have INCLUDED a css file in which there is a css rule like

.container-fluid > .sidebar {
  float: left;
  width: 220px;
}

the div container-fluid is in BasePage and sidebar div in ChildPage. Bu the problem
is after rendering the child page, it does not find the sidebar class and the page is not showing properly. But if you put the sidebar class css in ChildPage,it works. But if I have to put all child css specifically ,it will be a messy work in future where is a lot fo child page and the css will be redundant.

any clue ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

邮友 2024-12-14 12:40:45

BasePage/ChildPage 关系主要存在于 Java 中 - 当呈现最终页面时,它应该呈现为单个实体。例如,如果您通过 IHeaderContributor 插入 CSS,那么它在 ChildPage 或 BasePage 中不会产生任何影响 - 它将在同一点输入。

你所拥有的 CSS 非常有限。 > 字符表示直接子代(不是后代)。正如 Draevor 所指出的,Wicket 在开发模式中插入了大量额外的标记。将限制性 CSS 或 Javascript 与 Wicket 组件混合通常不是一个好主意。或者,更确切地说,要非常小心。

我想知道,当通过子页面插入 CSS 时,也许 Wicket 插入的“额外”div 会被跳过?这没有意义,但这将是一个有趣的实验。

The BasePage/ChildPage relationship mostly exists in Java - when the final page is rendered, it should be rendered as a single entity. For example, if you were inserting your CSS via an IHeaderContributor, it would not make a difference if it were in the ChildPage or BasePage - it would get entered at the same point.

The CSS you have is very restrictive. The > character implies a direct child (not a descendent). As Draevor indicated, Wicket inserts a lot of extra markup in Development Mode. It is generally not a good idea to mix restrictive CSS or Javascript with Wicket Components. Or, rather, be very careful about it.

I wonder, perhaps the "extra" div that is inserted by Wicket is skipped when the CSS is inserted via the child page? That doesn't make sense, but it would be an interesting experiment.

和我恋爱吧 2024-12-14 12:40:45

你看过源码吗?也许检票口插入了一些额外的标记。为了安全起见,只需从 CSS 声明中删除 > 即可,即使 div 之间有某些内容,它也应该可以工作。

Have you looked at the source? Maybe there's some additional markup being inserted by wicket. To be on the safe side, simply remove the > from your CSS declaration and it should work even if you have something in between the divs.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文