Все сервисы Хабра
Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Закрыть
Задать вопрос
shane89
@shane89
CSS
Простой способ сделать блок с кривой линией?
Вопрос задан
более трёх лет назад
1642 просмотра
Комментировать
Подписаться
1
Оценить
Комментировать
Facebook
Вконтакте
Twitter
Решения вопроса
1
Дмитрий
@Darth_Solo
Падаван области Фронт-энда.
Я делал таким вот способом:
Родителю {
transform: skewX(*deg); }
Сыну {
transform: skewX(-*deg); }
Только вот не скажу что у всех браузеров хорошее сглаживание, потому края выглядят далеко от идеала.
Ответ написан
более трёх лет назад
2
комментария
Нравится
1
2
комментария
Facebook
Вконтакте
Twitter
shane89
@shane89
Автор вопроса
не то, еще есть варианты?
Написано
более трёх лет назад
Дмитрий
@Darth_Solo
shane89
: Простых способов больше нет.
Проще только фоновую картинку взять.
Да и в принципе сложных способов то для этой задачи не особо много.
Написано
более трёх лет назад
Пригласить эксперта
Ответы на вопрос
2
Ксения Михайлова
@arizona
а что я, собственно, здесь делаю?...
А чем вас настолько не устраивает skew?
Можно нарисовать svg. Будет весьма растягиваемо и не мыльно.
Можно исхитриться нарисовать треугольники border'ом у before/after-элементов, но настолько узкого контентного блока у вас не получится.
Ответ написан
более трёх лет назад
2
комментария
Нравится
1
2
комментария
Facebook
Вконтакте
Twitter
shane89
@shane89
Автор вопроса
svg это уже интересней. Я только изучаю. Ксения не могли дать пример, как можно рисовать треугольник, на всю ширину монитора.
Написано
более трёх лет назад
Ксения Михайлова
@arizona
Вот здесь меню оформлено в помощью svg
kitchenstore.com.ru
Написано
более трёх лет назад
Михаил Чирский
@chirskiy_mixail
Очень давно занимаюсь версткой, имею огромный опыт
css3clickchart.com/#skew-transform
Ответ написан
более трёх лет назад
2
комментария
Нравится
2
комментария
Facebook
Вконтакте
Twitter
shane89
@shane89
Автор вопроса
не то, есть еще способы?
Написано
более трёх лет назад
Михаил Чирский
@chirskiy_mixail
shane89
: Смотря какая задача, и на сколько она приоритетна, т.к на картинке, вы на CSS не сделаете, т.к сглаживания идеального не будет
Написано
более трёх лет назад
Ваш ответ на вопрос
Войдите, чтобы написать ответ
Войти через центр авторизации
Похожие вопросы
CSS
Простой
Почему offset-path смещает координаты элемента и как это исправить?
2 подписчика
12 часов назад
58 просмотров
0
ответов
JavaScript
+2 ещё
Средний
Как сделать такой эффект фона на css/js?
1 подписчик
16 часов назад
120 просмотров
0
ответов
HTML
+1 ещё
Простой
Как лучше задать размер элемента, + как сделать треугольник в виде плеера?
1 подписчик
20 часов назад
61 просмотр
0
ответов
CSS
+1 ещё
Простой
Как правильно подключить шрифты в 1C-Битрикс и почему у меня не получается?
1 подписчик
02 июл.
171 просмотр
1
ответ
CSS
Простой
Как убрать фон в input после выбора?
1 подписчик
02 июл.
96 просмотров
1
ответ
HTML
+1 ещё
Простой
Как соединить кнопку и форму вместе?
1 подписчик
01 июл.
104 просмотра
1
ответ
JavaScript
+2 ещё
Простой
Как поменять цвет линии при нажатии?
1 подписчик
30 июн.
168 просмотров
1
ответ
JavaScript
+1 ещё
Простой
Как создать скрипт удаления элемента HTML используя Tempermonkey?
1 подписчик
29 июн.
120 просмотров
1
ответ
JavaScript
+1 ещё
Простой
Как реализовать выдвигающийся из айтема блок(при нажатии на плюс)?
1 подписчик
29 июн.
94 просмотра
0
ответов
HTML
+1 ещё
Простой
Как выровнить в колонку фотки как на макете?
1 подписчик
28 июн.
99 просмотров
1
ответ
Показать ещё
Загружается…
Вакансии с Хабр Карьеры
Старший Frontend (JavaScript) разработчик
Vital Partners
от 350 000 до 400 000 ₽
Front-End developer (JavaScript, jQuery)
Karma8
от 150 000 до 320 000 ₽
Frontend разработчик (Java-Script)
Товеко
от 45 000 до 80 000 ₽
Минуточку внимания
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации
Закрыть
Реклама