1. user-select: none;
Зачем? Запрещает пользователю выделять текст на элементе. Полезно для предотвращения копирования контента.
Пример:
.no-select {
user-select: none;
}
2. writing-mode: vertical-lr;
Зачем? Поворачивает текст на 90 градусов. Используется для создания вертикального текста или оформления, например, в меню.
Пример:
.vertical-text {
writing-mode: vertical-lr;
text-orientation: upright; /* Чтобы текст не был перевернут */
}
3. pointer-events: none;
Зачем? Запрещает элементу реагировать на события мыши, например, клики.
Пример:
.ignore-clicks {
pointer-events: none;
}
4. background-blend-mode: multiply;
Зачем? Создает эффекты наложения изображений, например, для создания теней или сложных цветовых переходов.
Пример:
.container {
background-image: url('image1.jpg'), url('image2.png');
background-blend-mode: multiply;
}
5. font-variant-ligatures: common-ligatures;
Зачем? Использует лигатуры (соединения букв) для создания более элегантного текста.
Пример:
.ligatures {
font-variant-ligatures: common-ligatures;
}
