/* Каждый блок Тильды делаем контейнером с обрезкой содержимого */ .t-rec { position: relative; overflow: hidden; } /* Размытый низ у каждого блока */ .t-rec::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; /* высота размытой зоны — можешь менять под себя */ height: 80px; pointer-events: none; /* размытие содержимого под этим слоем */ backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); /* градиент снизу — можно подкрутить под свои цвета */ background: linear-gradient( to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 60%, rgba(0, 0, 0, 1) 100% ); z-index: 5; } /* Фоллбек, если браузер не поддерживает backdrop-filter */ @supports not (backdrop-filter: blur(1px)) { .t-rec::after { backdrop-filter: none; -webkit-backdrop-filter: none; background: linear-gradient( to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0.9) 100% ); } }
Интерактивное обучение работе на фрезерных и токарных станках в виртуальной и смешанной реальности.