Задать вопрос
@Treniki
html

Как верстаются подобные блоки?

Доброго времени суток. Увидел в макете LP такую часть:
9fb0eb64c3ca42f7a6102a46677714c5.jpg
Я здесь вижу 3 блока, которые так или иначе вливаются друг в друга. Что-то, вроде, этого:
aec07cfc93e44f83a7cc7e3d8ade924b.jpg
Как бы вы сверстали подобное? Где бы вы провели линии? А рисунки с текстом в третьем блоки вы бы каким образом расставили? Что вообще думаете о подобном месте в макете?
  • Вопрос задан
  • 408 просмотров
1 комментарий
Подписаться 3 Оценить 1 комментарий
Решения вопроса 2
bubandos
@bubandos
bash'у, javascript'ую, php'лю, css'аю, html'каю
Без разницы как: хочешь - два дива плюс transform: skew, хочешь - два дива плюс border. Всеравно дальше позиционирование и z-index.
Для любителей поизвращаться можно и svg в бекгаунд впихнуть, но браузеры на них память кушают хорошо.
Ответ написан
Комментировать
Комментировать
RadCor
@RadCor
Если мой ответ вам помог, отмечайте его решением.
Сразу пришло в голову 3 Варианта.

1. Сделать картинками. То есть тупо нарезать изображения и поставить их как фоновые.
2. Сделать треугольники на css (не уверен что можно сделать их адаптивными).
3. Старым добрым SVG, тут и адаптивность и гибкость, всё как положено.

ДЕМО: https://jsfiddle.net/RadCor/ob74ucge/
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Специалист по телеграм
05 мая 2024, в 04:55
12000 руб./за проект
Название проекта: Бот Telegram для автоматизации судебных приказов
05 мая 2024, в 02:15
30000 руб./за проект
Десктоп приложение для добавления товаров на Python
05 мая 2024, в 01:43
5000 руб./за проект
Ещё заказы