someserj
@someserj

Как сверстать скошенный блок?

и непонятно что лучше - срезать синий блок или блок с картинкой. Если знаете, подскажите, пожалуйста, оба варианта
s9dnAsMRT02dnaI2CuY0TQ.png
  • Вопрос задан
  • 561 просмотр
Решения вопроса 1
alex_keysi
@alex_keysi
frontend developer
Лучше мне кажется как svg вставить. Фигура не сложная, можно path прописать самому. И тянуться хорошо будет
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
Ankhena
@Ankhena
Нежно люблю верстку
Без дополнительных блоков и псевдоэлементов: https://jsfiddle.net/Ankhena/omuc1b0u/
Ответ написан
Срезать блок с картинкой - это делать её в png - будет весть несколько мегабайт. Картинку оставляйте прямоугольной в jpg формате, а вообще вопрос легко гуглится
Как сделать скошенный блок с бэкграундом?
www.dejurka.ru/css/angled-edge-css3
Ответ написан
@kvaak
FE
Самый очевидный вариант - задать синему блоку :after - и сверстать его треугольником, абсолютно отпозиционированным справа
Как верстать треугольники
Ответ написан
@AndrewsN93
Можно через псевдоэлемент добавить блок, больших размеров по высоте, чем родитель с картинкой, и с помощью absolut позиционировать а потом через css3 transform развернуть на нужный угол, и родителю повесить overflow:hidden что бы не торчал псевдоэлемент. И не забыть про z-index'ы.
Ответ написан
Ваш ответ на вопрос

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

Войти через TM ID
Похожие вопросы
Genue Москва
от 30 000 до 120 000 руб.
Blogman Оренбург
от 20 000 до 60 000 руб.
Sveak Барнаул
от 40 000 руб.
17 дек. 2018, в 01:36
700 руб./в час
16 дек. 2018, в 22:06
700 руб./в час
16 дек. 2018, в 21:48
1000 руб./за проект