Чтобы создать двухцветный фон с помощью CSS, вы можете использовать несколько методов. Вот некоторые из них:

1. Использование градиентов CSS:

   body {
    background: linear-gradient(to right, red, blue);
   }

   Это создаст градиентный фон с переходом от красного к синему по горизонтали.

2. Использование нескольких фонов:

   body {
    background-image: linear-gradient(to right, red, red), linear-gradient(to right, blue, blue);
    background-position: left top, right top;
    background-repeat: no-repeat;
   }

   Этот метод применяет два отдельных линейных градиента, по одному для каждого цвета, и размещает их на левой и правой сторонах фона.

3. Использование псевдоэлементов CSS:

   «»;
   позиция: фиксированная;
   сверху: 0;
   справа: 0;
   ширина: 50%;
   высота: 100%;
   фоновый цвет: синий;

   Этот метод использует псевдоэлементы ::beforeи ::afterдля создания двух элементов с фиксированным расположением и разными цветами фона.

4. Использование CSS Grid:

   body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background-color: red;
   }
   .content {
    background-color: blue;
   }

   В этом методе элементу body присваивается контейнер сетки и определяются два столбца. Первый столбец будет иметь красный цвет фона, а содержимое второго столбца — синий цвет фона.