416 читали · 2 года назад
Как стилизовать скролл-бар, используем только CSS
Народ, всем привет. Сегодня у нас тема больше для программистов, особенно начинающих. А именно, как можно стилизовать скролл. Кто не помнит, это такая полосочка прокрутки справа или слева страницы или любого блока. Причем стилизовать мы его будем не за счет каких-то плагинов, а по большей части, библиотек, UI-компонентов и прочего на JS, а просто за счет CSS. Вариантов там немного, но все же немного подправить стандартный «серый» скролл можно. Но, самое важно, что нужно понять – стилизовать скролл самой страницы не нужно, это считается плохим тоном, да и вообще, выглядит убого...
170 читали · 1 год назад
🤹 25 CSS-трюков, которые должен знать каждый разработчик
Современный веб-дизайн требует глубокого понимания возможностей CSS. Мы расскажем о 25 передовых CSS-техниках, которые помогут вам создавать стильные, функциональные и производительные веб-сайты, соответствующие последним трендам. Этот материал взят из нашей еженедельной email-рассылки, посвященной фронтенду. Подпишитесь, чтобы быть в числе первых, кто получит дайджест. 📧 Подписаться (function () { let link = document .getElementById ("801e3965-f17f-4474-b191-6f200c8d43e9-https://proglib...
Скроллбар меньше родительского блока на чистом CSS
Все чаще скрипты можно заменить стилями. Сегодня расскажу как сделать горизонтальный слайдер с полосой прокрути уже (меньше по ширине), чем родительский блок. Сперва накидаем html: <div class="block"> <span></span><span></span><span></span><span></span><span> </span><span></span> <span></span><span></span><span></span><span></span><span></span><span></span> </div> немного стилей: .block{ display: flex; margin: 100px -10px 100px; overflow-x: auto; }. block>span{ width: 150px; ...
4 года назад
Сделайте свой сайт особенным с помощью настраиваемой полосы прокрутки
Полоса прокрутки - один из наиболее игнорируемых компонентов пользовательского интерфейса, которые не используются многими веб-сайтами для повышения удобства работы своих пользователей. По умолчанию во всем HTML, когда содержимое веб-сайта превышает высоту области просмотра, справа автоматически появляется полоса прокрутки, точно такая же, как на большинстве сайтов. Полоса прокрутки по умолчанию выглядит неплохо, но может быть и лучше. 😊 html::-webkit-scrollbar { width: 16px; height: 16px; } html::-webkit-scrollbar-thumb...