Слегка поверните элемент фона
Я создал макет, в котором элемент фона слегка повернут в верхнем левом углу.
Но как бы то ни было, я видел кое-что, что вы можете сделать с SVG, но никогда раньше не работал с ним.
Прямо сейчас я использую следующую технику:
.background {
width:100%;
margin-left: -160px;
margin-right: -160px;
transform: rotate(20deg);
}
и это вращает элементы в противоположном направлении, что они просто выровнены по горизонтали.
Но это не совсем подходит моему экрану, когда я уменьшаю масштаб или мне нужно иметь много отрицательных полей, но я не думаю, что это хороший способ решить эту проблему.
ВотCodePen как дела сейчас
Вот как это должно выглядеть:
Приведенное выше изображение является лишь одной плиткой для образца.Вот как это будет выглядеть на странице. Черные полосы на всю ширину экрана - это идея.
нетhover
эффекты необходимы на форме, это просто должно быть статичным.