Стилизация одного угла элемента (обычно верхнего правого или нижнего правого) так, чтобы он выглядел загнутым, с разной степенью реализма — это дизайнерский прием, не теряющий своей популярности вот уже много лет. Сегодня в его применении нам помогают несколько решений на чистом CSS, первое из которых было опубликовано еще в 2010 году мастером работы с псевдоэлементами Николасом Галлахером. Основной путь решения — добавить два треугольника в верхнем правом углу: один для представления загнутого уголка страницы и второй — закрывающий собой угол главного элемента. Эти треугольники чаще всего создаются с помощью проверенного временем трюка с рамкой. В свое время эти решения смотрелись весьма впечатляюще, но сегодня мы понимаем, насколько они ограниченны. В некоторых ситуациях они попросту неприменимы: когда фон, находящийся позади нашего элемента, не залит сплошным цветом, а оформлен с использованием узора, текстуры, фотографии, градиента или фонового изображения любого другого типа; когда мы хотим загнуть уголок под другим углом, отличным от 45°, или же добавить легкое вращение. Читать далее
Это интересно
+1
|
|||
Последние откомментированные темы:
-
Обзор смартфона LG Optimus L9
(1)
hobert
,
01.03.2022
-
Антивирусные приложения Android для защиты устройства
(1)
Наталья_ласточка
,
27.02.2022
-
Как отключить уведомления от Сбербанк за 60 рублей через приложение Сбербанк онлайн и ещё 5 методов!
(1)
bbob
,
15.02.2022
-
Обходим блокировку сайтов.
(3)
Евгений_к
,
07.02.2022
20240428102050