Блог

Главная - Вопросы по программированию - наследование правил css на родительско-дочерних страницах wicket

наследование правил css на родительско-дочерних страницах wicket

#html #css #wicket

#HTML #css #wicket

Вопрос:

У меня проблема с разрешением классов css на родительских дочерних страницах wicket.

У меня есть базовая страница wicket (базовая страница) и дочерняя страница (дочерняя страница), расширяющая базовую страницу.

Div в базовой странице выглядит так,

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

и на дочерней странице

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

в мою базовую страницу css я ВКЛЮЧИЛ файл css, в котором есть правило css, например 

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

div container-fluid находится на базовой странице, а sidebar div — на дочерней странице. Но проблема
в том, что после рендеринга дочерней страницы он не находит класс боковой панели, и страница отображается неправильно. Но если вы поместите класс css боковой панели в дочернюю страницу, это сработает. Но если мне придется специально использовать все дочерние css, в будущем это будет грязная работа, где будет много дочерних страниц, и css будет избыточным.

есть какие-нибудь подсказки?

Комментарии:

1. Когда вы говорите, что помещаете это в один или другой, означает ли это, что вы используете <style></style> элементы?

2. да, если я помещаю css в дочерний стиль отдельно, он работает, очевидно, поскольку находит правило css, но я уже включил файл css в заголовок wicket родительской страницы. Разве это не должно включаться в дочернюю страницу при рендеринге?

Ответ №1:

Связь между базовой и дочерней страницами в основном существует в Java — когда отображается конечная страница, она должна отображаться как единое целое. Например, если вы вставляли свой CSS через IHeaderContributor, не имело бы значения, был ли он на дочерней или базовой странице — он был бы введен в той же точке.

CSS, который у вас есть, очень ограничен. > Символ подразумевает прямого потомка (не потомка). Как указал Дрейвор, Wicket вставляет много дополнительной разметки в режиме разработки. Как правило, не рекомендуется смешивать ограничительные CSS или Javascript с компонентами Wicket. Или, скорее, будьте очень осторожны с этим.

Интересно, возможно, «лишний» div, который вставляется Wicket, пропускается, когда CSS вставляется через дочернюю страницу? Это не имеет смысла, но это был бы интересный эксперимент.

Ответ №2:

Вы смотрели на источник? Возможно, wicket вставляет какую-то дополнительную разметку. На всякий случай просто удалите > из своего объявления CSS, и оно должно работать, даже если у вас есть что-то среднее между разделами.