someserj
@someserj

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

и непонятно что лучше - срезать синий блок или блок с картинкой. Если знаете, подскажите, пожалуйста, оба варианта
s9dnAsMRT02dnaI2CuY0TQ.png
  • Вопрос задан
  • 560 просмотров
Решения вопроса 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
Похожие вопросы