Как убрать элемент на задний фон, чтобы он не лежал выше текста?

Чтобы убрать элемент на задний фон и не позволить ему перекрывать текст, можно использовать свойство CSS - z-index.

Свойство z-index определяет порядок расположения элементов на экране по оси z (ось, перпендикулярная плоскости экрана). Оно позволяет контролировать, какой элемент будет отображаться поверх других элементов.

По умолчанию, значения z-index равны 0 для всех элементов. Если нужно, чтобы определенный элемент был ниже и не перекрывал другие, можно применить z-index со значением, меньшим, чем 0. Например:

.element {
  position: relative;
  z-index: -1;
}

Здесь мы использовали позиционирование relative для элемента, чтобы задать z-index. Значение -1 означает, что элемент будет ниже по стеку отображения по сравнению с элементами со значением z-index равным 0 или больше.

Однако, если задача состоит в том, чтобы скрыть элемент полностью, чтобы он не занимал место на странице и не перекрывал текст, то можно использовать свойство CSS - display или visibility.

.element {
  display: none;
}

или

.element {
  visibility: hidden;
}

Оба эти свойства позволяют скрыть элемент, но они влияют на то, как элемент влияет на остальные элементы на странице. display: none полностью удаляет элемент из потока документа и он не занимает место на странице, в то время как visibility: hidden скрывает элемент, но он продолжает занимать место, так как его видимость просто установлена как скрытая.

В зависимости от конкретной задачи, можно выбрать наиболее подходящий способ убрать элемент на задний фон и не позволить ему перекрывать текст.