Изменение свойства фона html, а не тела

#javascript #html #css #background

Вопрос:

Как изменить свойство фона html? Мне удалось изменить фон элемента тела, но я хочу манипулировать html-тегом (?).

Код для управления фоном тела

 document.body.style = 'background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%);';

Эти попытки не увенчались успехом

 document.html.style = 'background: red'; document.style = 'background: red';

Я хочу изменить эту часть

 html {  font-family: Arial, Helvetica, sans-serif;  color: white;  -webkit-user-drag: none;  user-select: none;  -moz-user-select: none;  -webkit-user-select: none;  -ms-user-select: none;   background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%); }

1. зачем пытаться проверить html-документ, если видимой частью является элемент тела? Что плохого в использовании правильного элемента?

2. Высота моего тела меняется, когда пользователь разворачивает таблицу или что-то подобное, и это вызывает некоторые уродливые эффекты, потому что фон перестраивается. С фоновым свойством внутри html этого не происходит

Ответ №1:

Вам нужно использовать document.documentElement.style для таргетирования html элемента.

 document.body.style = 'background: radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%);';  document.documentElement.style = 'background: red';

 lt;htmlgt;  lt;bodygt;  lt;pgt;testlt;/pgt;  lt;/bodygt; lt;/htmlgt;

Ответ №2:

измените фон с помощью javascript в теге html, попробуйте это :

 document.getElementsByTagName('html')[0].style.background="radial-gradient(circle, rgba(131,170,203,1) 4%, rgba(69,113,148,1) 50%, rgba(39,71,97,1) 100%)";

Ответ №3:

просто поместите фоновый div в DOM и манипулируйте им. например, позиция: абсолютный / z-индекс: -1