CSS - возможно ли иметь div html (на странице) без правил CSS для страницы - PullRequest
0 голосов
/ 27 февраля 2019

У меня проблема с порталом Liferay.

У меня есть веб-контент с текстовой частью, сохраненной в формате html.В моем JSP у меня есть:

 <div>${aWebContent.content}</div>

Но на странице есть CSS, который применяется ко всей странице (тема LifeRay), и я не хочу, чтобы это было применено к моему DIV.Существует ли решение для этого?

Thnaks!

Ответы [ 3 ]

0 голосов
/ 27 февраля 2019

Один из вариантов - встроить ваш виджет в iframe;как таковые, никакие стили из окружающего документа не наследуются.Этот метод используется многими социальными виджетами, такими как кнопки общего доступа, чтобы не было никаких стилевых помех.

Существуют только CSS-опции, которые начинают внедряться.Safari поддерживает:

.widget { all: revert; )

, что делает именно то, что вам нужно.Есть большая поддержка:

.widget { all: initial; )

, которая поддерживается всеми современными браузерами (не Internet Explorer), но удаляет стили назад после по умолчанию браузера (например, <div> s станет встроенным)поэтому вам придется добавить их обратно, например:

.widget block { display: block; }

Но, по крайней мере, вы не получите стилевое столкновение.

https://developer.mozilla.org/en-US/docs/Web/CSS/initial
https://developer.mozilla.org/en-US/docs/Web/CSS/revert

0 голосов
/ 27 февраля 2019

В то время как другие ответы (все: начальные) хороши, вот еще один аспект: вы можете захотеть иметь какой-то стиль, так что вы можете иметь более конкретный стиль в своей теме.Некоторые браузеры по умолчанию используют черный на сером, а некоторые - черный на белом.

0 голосов
/ 27 февраля 2019

Вы можете сбросить все стили элемента, установив all свойство CSS.

.someDivClass{
  all: initial;
}

Это приведет к удалению всех примененных CSS-элементов в этом элементе как по отдельности, так и по родительскому элементу, и вернется к исходному значению.

Более подробно вы можете обратиться к - https://developer.mozilla.org/en-US/docs/Web/CSS/all

Это свойство поддерживается не во всех браузерах. Чтобы узнать, поддерживается ли браузер, перейдите по этой ссылке - https://caniuse.com/#search=all

...