Destell
@Destell
React, React Native junior developer

Как адекватно сверстать подобный фон?

Картинка

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

Одним из вариантов было использование нескольких бэкграундов, на верхний правый, нижний правый и нижний левый углы, но при задании белого фона, фон ложится и под квадраты. Была так же мысль о псевдоэлементах, но не уверен, что это лучший способ.
  • Вопрос задан
  • 158 просмотров
Решения вопроса 1
@forspamonly2
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
Madeas
@Madeas
UI / UX Designer, Frontend Developer
Можно сделать вроде такого:
<div style=position: relative;background-image...>
<div style=position:absolute;left:;top:;></div>
<div style=position:absolute;bottom:;right:;></div>
<div style=position:absolute;right:;top:;></div>
<div style=position:absolute;bottom:;left:;></div>
<div>и т.д.</div>
</div>
Ответ написан
webinar
@webinar
Учим yii: https://youtu.be/-WRMlGHLgRg
Режем на части картинку, устанавливаем блоку несколько background. Но по моему адекватнее просто 1 картинку.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы