Все сервисы Хабра
Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Закрыть
Задать вопрос
mr jeery
@jeerjmin
HTML
CSS
Веб-разработка
Вёрстка
Как обрубить верхний-левый угол у div имея неоднородный фон?
https://codepen.io/Jeerjmin/pen/rKZKJz
У меня есть такое решение, но оно работает с однородным фоном, который можно выставить. А как быть если фон картинка ?
Вопрос задан
более трёх лет назад
608 просмотров
1
комментарий
Подписаться
1
Простой
1
комментарий
Facebook
Вконтакте
Twitter
Амир Алимжанов
@Amirez
https://ru.stackoverflow.com/questions/639765/%D0%...
Написано
более трёх лет назад
Решения вопроса
0
Пригласить эксперта
Ответы на вопрос
3
BarryHAllen
@BarryHAllen
Задача - сделать угол прозрачным?
Если так, то:
background: linear-gradient(135deg, transparent 36px, white 20px);
https://codepen.io/anon/pen/oyPMZK
upd: с границей по периметру:
https://codepen.io/anon/pen/mKzOrz
Ответ написан
более трёх лет назад
4
комментария
Нравится
4
4
комментария
Facebook
Вконтакте
Twitter
Амир Алимжанов
@Amirez
искал этот способ)
Написано
более трёх лет назад
mr jeery
@jeerjmin
Автор вопроса
BarryHAllen
, А как с вашим решением сделать границу по периметру ? У меня в примере она была, вы ее убрали.
Написано
более трёх лет назад
BarryHAllen
@BarryHAllen
mr jeery
немного магии
https://codepen.io/anon/pen/mKzOrz
Написано
более трёх лет назад
mr jeery
@jeerjmin
Автор вопроса
BarryHAllen
, если img кота сдвинуть влево
left: -40px;
, то изображение накладывается на левую границу. Как это избежать ?
Написано
более трёх лет назад
Ankhena
@Ankhena
Куратор тега CSS
Нежно люблю верстку
1. Фон из 5 градиентов. Нижний фон под углом 45 градусов прозрачный-синий-белый. И поверх 4 из синего в прозрачный с позиционированием и размером.
2. SVG
https://jsfiddle.net/rwcaj9g5/
Ответ написан
более трёх лет назад
3
комментария
Нравится
3
комментария
Facebook
Вконтакте
Twitter
Ankhena
@Ankhena
Куратор тега CSS
Сейчас с телефона, поэтому только логика, без кода.
С svg проще
Написано
более трёх лет назад
mr jeery
@jeerjmin
Автор вопроса
Ankhena
, Как с svg проще ? Вы в каком-то редакторе с ними работаете а потом экспортируете код ? Я пробовал со скетча экспортировать, но он с ошибками вылезает.
Написано
более трёх лет назад
Ankhena
@Ankhena
Куратор тега CSS
mr jeery
, например, вот так:
https://jsfiddle.net/rwcaj9g5/
Почитайте:
css.yoksel.ru/svg-shapes
css.yoksel.ru/svg-fill-and-stroke
И
qaru.site/questions/132892/svg-rounded-corner
Написано
более трёх лет назад
Алексей
@AlexZagatskiy
HTML / CSS developer
Примерно такое решение может подойти:
https://codepen.io/Zagatskiy/pen/YvJpqL
Ответ написан
более трёх лет назад
3
комментария
Нравится
3
комментария
Facebook
Вконтакте
Twitter
mr jeery
@jeerjmin
Автор вопроса
Алексей
это какой-то изврат, занимает слишком много места.
Написано
более трёх лет назад
Алексей
@AlexZagatskiy
можно добавить еще одну обертку, тогда размеры будут такие как нужно
Написано
более трёх лет назад
mr jeery
@jeerjmin
Автор вопроса
Алексей
, Если я хочу чтобы три карточки стояли друг за другом, с помощью flex row, то обертка мешает. Как можно добавить еще одну чтобы все ок было ?
Написано
более трёх лет назад
Ваш ответ на вопрос
Войдите, чтобы написать ответ
Войти через центр авторизации
Похожие вопросы
Веб-разработка
+1 ещё
Простой
Как создать пользователя в marzban?
2 подписчика
20 часов назад
165 просмотров
0
ответов
Вёрстка
Средний
Как создать эффект для активной кнопки?
1 подписчик
09 июл.
98 просмотров
1
ответ
JavaScript
+1 ещё
Простой
Как сделать, чтобы на сайте картинка при нажатии открывалась в большом размере а при повторном щелчке возвращалась к исходнику? В HTML?
1 подписчик
07 июл.
766 просмотров
5
ответов
PHP
+2 ещё
Простой
Есть web-сервер на php или nodejs который поддерживает работу с .htaccess?
1 подписчик
07 июл.
1426 просмотров
4
ответа
JavaScript
+3 ещё
Простой
Как открыть ссылку из html-файла на диске в той же вкладке браузера?
1 подписчик
07 июл.
183 просмотра
2
ответа
CSS
Простой
Почему offset-path смещает координаты элемента и как это исправить?
2 подписчика
06 июл.
120 просмотров
0
ответов
JavaScript
+2 ещё
Средний
Как сделать такой эффект фона на css/js?
2 подписчика
06 июл.
1553 просмотра
0
ответов
HTML
+1 ещё
Простой
Как лучше задать размер элемента, + как сделать треугольник в виде плеера?
1 подписчик
06 июл.
90 просмотров
0
ответов
Вёрстка
Простой
TG Mini App Full screen отступ от выреза?
2 подписчика
05 июл.
242 просмотра
1
ответ
CSS
+1 ещё
Простой
Как правильно подключить шрифты в 1C-Битрикс и почему у меня не получается?
1 подписчик
02 июл.
197 просмотров
1
ответ
Показать ещё
Загружается…
Вакансии с Хабр Карьеры
HTML-верстальщик (HTML/CSS/JavaScript)
CleanTalk
от 100 000 ₽
Frontend-разработчик
MyAdsTarget
от 150 000 ₽
Front-End developer (JavaScript, jQuery)
Karma8
от 150 000 до 320 000 ₽
Минуточку внимания
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации
Закрыть
Реклама