Задать вопрос
Местоположение
Украина, Одесская обл., Одесса

Наибольший вклад в теги

Все теги (2)

Лучшие ответы пользователя

Все ответы (3)
  • Как сверстать этот блок?

    nitroua
    @nitroua Автор вопроса
    Разобрался с помощью svg. Вот код, может пригодится кому.

    .block:before {
    	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23eefcff;' /%3E%3C/svg%3E");
        left: 0;
        top: -120px;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        content: '';
        display: block;
        height: 120px;
        position: absolute;
        width: 100%;
    }
    .block:after {
    	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23eefcff;' /%3E%3C/svg%3E");
        right: 0;
        bottom: -120px;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        content: '';
        display: block;
        height: 120px;
        position: absolute;
        width: 100%;
        transform: rotateX(180deg);
    }


    В свойстве background-image можно задать цвет любой, оставив "%23" в этом:"%23eefcff", а "eefcff" заменить на необходимый.
    Ответ написан
    2 комментария

Лучшие вопросы пользователя

Все вопросы (1)