Как сделать красивую полосу прокрутки на Вашем сайте? CSS
Главная » Сайты » CSS
CSSАвтор Генералов Андрей На чтение 4 мин. Опубликовано
скачать бесплатно — » HTML на примерах, всё доступно и просто (для начинающих)»
— — —— — — >> с к а ч а т ь <<
скачать бесплатно — «Как создать классный сайт!
От начала и до конца»
——>> с к а ч а т ь <<
<<< ВЕРНУТЬСЯ НАЗАД
Как сделать красивую полосу прокрутки, которая бы подходила по цвету и по гамме вашего сайта. Иногда, когда мы смотрим на сайт, нам не хватает определенного цвета на полосе прокрутки. Но сегодня у вас всё получится. Я расскажу и покажу вам на примере, как сделать красивую полоску прокрутки. Это не сложно.
Я буду использовать только CSS.
Вообще, есть два способа.
1). Вставляется код на каждую страничку сайта, где вы хотите видеть красивую полосу прокрутки.
2). Вставляется код в общий CSS файл. На всех страницах сайта будет отображаться красивая полоска прокрутки.
Внимание: читают этот эффект все браузеры, кроме Google Chrome.
**СКАЧАТЬ СБОРНИК ГОТОВЫХ СКРИПТОВ с turbobit 13,8 Мб .
Начнем.
Способ – 1. Вставляется код на каждую страничку сайта.
<html>
<head>
<title>
Способ – 1. Вставляется код на каждую страничку сайта.
</title>
<meta http-equiv=»Content-Type» content=»text/html; charset=windows-1251″>
<style>
body { scrollbar-face-color:#5997CA;
scrollbar-shadow-color: #ffffff;
scrollbar-highlight-color: #ffffff;
scrollbar-3dlight-color: #5997CA;
scrollbar-darkshadow-color: #5997CA;
scrollbar-track-color: #F6F6F6;
scrollbar-arrow-color: #F6F6F6; }
</style>
</head>
<body>
Ваш текст
</body>
</html>
Что означают эти параметры?
1.
scrollbar-arrow-color — цвет стрелки.
2. scrollbar-track-color — цвет подложки.
3. scrollbar-face-color — цвет самой полосы.
4. scrollbar-shadow-color
scrollbar-highlight-color
— цвет разделяющей полосы.
5. scrollbar-3dlight-color
scrollbar-darkshadow-color
— цвет внешних границ полосы. Способ — 2. Вставляется код в общий CSS файл.
В HTML – пишем.
<html>
<head>
<title>
Способ — 2. Вставляется код в общий CSS файл.
</title>
<meta http-equiv=»Content-Type» content=»text/html; charset=windows-1251″>
<link href=»style.css» rel=»stylesheet» type=»text/css»>
</head>
<body>
Ваш текст
</body>
</html>
CSS файле «style.css» – пишем.
body { scrollbar-face-color:#5997CA;
scrollbar-shadow-color: #ffffff;
scrollbar-highlight-color: #ffffff;
scrollbar-3dlight-color: #5997CA;
scrollbar-darkshadow-color: #5997CA;
scrollbar-track-color: #F6F6F6;
scrollbar-arrow-color: #F6F6F6; }
Вот и всё.
Теперь ваша полоса прокрутки на сайте станет красивей. Если Вы не знаете код нужного вам цвета, советую заглянуть на страничку «Палитра цветов», где вы увидите все, что Вам нужно по шифру цвета.
**СКАЧАТЬ СБОРНИК ГОТОВЫХ СКРИПТОВ с turbobit 13,8 Мб .
<<< ВЕРНУТЬСЯ НАЗАД
ВЫБЕРИТЕ РАЗДЕЛ
JavaScript >> |
PHP >> |
HTML >> |
CSS >> |
Использование свойства overflow CSS | Impuls-Web.ru
Категория: Сайтостроение, Опубликовано: 2018-12-17
Автор: Юлия Гусарь
Приветствую вас дорогие друзья!
В одной из прошлых статей я рассказывала о наиболее часто используемых CSS-свойствах.
С данной статьей вы можете познакомиться по этой ссылке: Основы CSS. Базовые свойства
В этой статье я упоминала о свойстве overflow CSS, которое предназначено для управления контентом, расположенном в блочных элементах.
Навигация по статье:
- Управление отображением контента в блоке свойством overflow CSS
- Добавление полос прокрутки для блоков небольшого размера свойством overflow CSS
Сегодня я хочу более подробно остановиться на данном свойстве и разобрать примеры его использования на практике.
Управление отображением контента в блоке свойством overflow CSS
По умолчанию для всех блочных элементов overflow
Для overflow CSS можно задать следующие значения:
- hidden — отображение контента только внутри блока, а остальная часть обрезается
- scroll — добавляет полосы прокрутки по вертикали и горизонтали
- auto – добавление полос прокрутки только в случае, если контент выходит за границы блока
- inherit – наследование значений родительского блока
Больше всего возникает проблем с маленькими по размеру блоками, например, такими как названия товаров в каталоге интернет-магазина.
Из-за того, что у товаров разные по длине названия, карточки имеют разную высоту, и это выглядит очень не красиво.
Если мы просто ограничим высоту бока с названием у нас получится вот так:
Даже при заданном размере блока с названием, текст все равно выходит за его пределы и налезает на цену товара. Подобные случаи встречаются довольно часто и для решения этой проблемы нам нужно сделать следующее:
#tovary .product h3 { height: 30px; overflow: hidden; }
#tovary .product h3 { height: 30px; overflow: hidden; } |
Мы добавляем для блока с названием товара свойство overflow CSS со значением hidden. В данном случае будет отображаться только та часть контента, которая находится в пределах блока. Все остальное будет обрезаться. Вот что получиться:
Как видите, в обеих карточках товара название имеет одинаковую высоту, которая не будет изменяться ни в случае с еще большим названием, ни при изменении размера экрана устройства, с которого просматривают данный сайт.
Добавление полос прокрутки для блоков небольшого размера свойством overflow CSS
Давайте рассмотрим ситуацию, когда у вас есть блок с ограниченной высотой, но в нем нужно поместить контент произвольного размера, и возможно, что данный контент будет намного больше размера блока.
Например, у нас есть всплывающая корзина товаров в интернет-магазине. Если в нее добавить большое количество товаров мы получим вот такой результат:
Товаров так много, что они не помещаются на видимую часть страницы, и у посетителя нет возможность нажать на кнопку «Оформить заказ». Это очень не красиво и не удобно.
Выходом из данной ситуации является ограничение максимальной высоты для блока с товарами, и добавление вертикальной полосы прокрутки для него. Для этого мы задаем следующие стили для этого блока:
#pop-up-products-list { overflow-y: auto; /*Автоматическое добавление полосы прокрутки* / max-height: 300px; /*Максимальная высота блока*/ }
#pop-up-products-list { overflow-y: auto; /*Автоматическое добавление полосы прокрутки* / max-height: 300px; /*Максимальная высота блока*/ } |
Свойство overflow-y CSS — это то же самое свойство overflow, но предназначенное для управления контентом только по вертикали.
В данном случае мы добавили для overflow-y значение auto, которое добавляет полосы прокрутки по вертикали только при необходимости.
Вот что у нас получится:
Когда в корзине мало товаров, то нет никакой полосы прокрутки, и блок подстраивается по высоте, под количество товаров.
При большом количестве товаров, появляется полоса прокрутки, но при этом блок не превышает максимальной высоты.
Не забудьте оставить свой комментарий под статьей и поделиться своим опытом по использованию данного свойства или решению подобных проблем. Если вам понравилась данная статья, обязательно поделитесь ею со своими друзьями в социальных сетях.
Желаю вам успехов! До встречи в следующих статьях!
С уважением Юлия Гусарь
18+ примеров CSS с пользовательской полосой прокрутки с кодом
В современном веб-дизайне клиентов интересует то, как хорошо выглядит сайт. Однако полоса прокрутки не сильно центрирована. Говоря о полосе прокрутки, взгляните на некоторые коллекции реактивных пользовательских полос прокрутки. Базовые полосы прокрутки преувеличены, поэтому, когда вы добавляете эффекты к этим превосходным полосам прокрутки, они превращаются в какое-то хобби. В компьютеризированную эпоху дизайнеры внешнего интерфейса создают множество красивых планов и различных компонентов, которые должны отображаться на первой странице, которые ясно выражают эмоции. Но в то же время это сумасшедший компонент с точки зрения передачи заряда. Добавление ударов к полосам прокрутки составляет запланированную сумму. Итак, в этой статье мы обсудим различные примеры пользовательской полосы прокрутки CSS, а также горизонтальной полосы прокрутки, каждая из которых имеет разный стиль и цвет с помощью HTML, CSS и JavaScript.
Полоса прокрутки хорошо известна благодаря своей адаптивности. Эти полосы прокрутки легкие, поэтому размер и время нагрузки быстрое. Пользовательская полоса прокрутки известна тем, что клиент может изменить стиль полосы прокрутки по своему усмотрению.
Как мы, вероятно, знаем, эти полосы прокрутки делают страницу привлекательной, что повышает понимание клиента. Вместо того, чтобы использовать эквивалентные полосы прокрутки, вы можете использовать некоторые передовые.
Коллекция примеров пользовательской полосы прокрутки CSS с фрагментом кода
В этом кратком изложении есть множество мотиваций пользовательских полос прокрутки, убедитесь, что вы проверили каждую из них.
Связанные
- Пользовательские компоненты полосы прокрутки React
- Фиксированный липкий заголовок CSS при прокрутке вниз
- Awesome React Parallax Scroll Effects
- Pure CSS Parallax Scrolling Effect 9 0025
Как насчет того, чтобы поговорить о части настраиваемой полосы прокрутки в короткий.
Короткий обмен на пользовательской полосе прокрутки, как показано ниже
1. Полосы прокрутки Webkit CSS
Если вы создаете отдельный сайт для консультанта или стартап-сайта изобретателя, это воздействие создает приятную атмосферу для клиентов. Вместо того, чтобы просто использовать обычную полосу прокрутки, их привлекательное представление привлечет внимание клиента. Как и в демонстрации, вы можете увидеть различные виды полос прокрутки с различным форматом и планом. Вы можете открыто использовать их для себя. Вы можете видеть, что некоторые из них являются простыми, а некоторые несколько необычными, которые вспыхивают при дрейфе.
Наконец, вам сообщается общая структура кода, с помощью которой вы можете настроить воздействие и увидеть в зависимости от вашего вещества.
Демо/Код
2. Пользовательский стиль полосы прокрутки
Я люблю цвета. Я верю, что все втянуты в это. Эта полоса прокрутки выглядит так ярко. Если вам нужно, чтобы ваш сайт выглядел ярким, вы можете использовать это, без сомнения.
Как и в демонстрации, вы можете увидеть три отдельных сегмента, которые имеют разные оттенки и планы. Выберите тот, который вам нравится, и используйте его, чтобы сделать свой сайт модным.
Воздействие при осмотре должно быть гладким и чистым, чтобы клиент мог почувствовать воздействие. Поскольку эта структура полностью использует содержимое HTML, CSS и JS, вы, несомненно, можете без проблем использовать этот код на современных сайтах. Кроме того, это один из примеров пользовательской полосы прокрутки css с другим стилем и цветом.
Демонстрация/Код
3. Вертикальная пользовательская полоса прокрутки CSS
Это также то же самое, что и полосы прокрутки, которые мы только что рассмотрели. Существуют различные оттенки и структура полосы прокрутки. Полоса прокрутки безупречна и проста, поэтому их можно эффективно использовать в задачах. Различные оттенки используются для различных полос прокрутки, чтобы клиент мог видеть новые структуры.
Это еще один пример пользовательской полосы прокрутки css с другим стилем и цветом.
Кроме того, использование CSS применяет стиль для настройки полосы прокрутки. Просто выберите тот, который вам нужен на вашем сайте или в вашем предприятии.
Демонстрация/Код
4. Примеры полосы прокрутки HTML CSS
Из самой демонстрации вы можете понять, что эта полоса прокрутки имеет отполированную структуру. Эта модель css имеет множество вариантов полос прокрутки, доступных с цветом. Эта модель является основной из-за ее истинности в полосе прокрутки. Эти экземпляры пользовательской полосы прокрутки css имеют различные оттенки и стили, а также эффект, достигнутый с помощью html и CSS.
Аналогичным образом, пользовательская полоса прокрутки css может помочь клиенту при просмотре этого экрана. Кроме того, темная тема на заднем плане выглядит неплохо.
Демонстрация/Код
5. Привязка прокрутки CSS
Как видно из демонстрации, вы можете видеть содержимое в основном разделе. Полоса прокрутки css выглядит довольно просто, что хорошо смотрится с цветом на ней.
Эффект прокрутки также плавный. Кроме того, в разделе заголовка есть несколько пунктов меню, которые разделены. Нажав на любой из них, вы попадете на соответствующую страницу. Таким образом, прокрутка не требуется, если вы нажимаете на пункты меню.
Это еще один пример пользовательской полосы прокрутки с другим стилем и цветом с помощью css и javascript.
Демонстрация/Код
6. Пользовательская полоса прокрутки HTML и CSS
Этот план представляет собой еще одну пользовательскую полосу прокрутки, полностью основанную на CSS. Вы можете использовать этот план в областях целевой страницы и для существенного содержания на других страницах. Этот план показывает, как эффективно привлечь внимание клиентов. В структуре по умолчанию инженер использовал уникальные варианты схемы затенения, но вы даже можете использовать схему затенения под углом, чтобы сделать структуру изюминкой. Существуют различные структуры полосы прокрутки, из которых вы можете просматривать.
Его исходный код с открытым исходным кодом, и вы можете без особых усилий использовать его в своем деле.
Полоса прокрутки безупречна и, кроме того, работает легко. Это еще один пример пользовательской полосы прокрутки css с другим стилем и цветом.
Демо/Код
7. Пользовательская полоса прокрутки только с CSS
Эта пользовательская полоса прокрутки разработана Арроном Маккрори в Codepen. Это полоса прокрутки CSS с оправданным кодом. Мы говорили о многочисленных полосах прокрутки в одной точке. Тем не менее, этот содержит одиночную полосу прокрутки, которая выглядит привлекательно. Синяя полоса прокрутки, которая кажется гладкой и красивой, когда вы применяете ее к своим действиям.
Тем не менее, это легкий и простой в использовании компонент для вашей веб-композиции. Дизайн также полностью настраиваемый.
Демонстрация/Код
8. Вертикальная полоса прокрутки, настроенная CSS
Это простой пример полосы прокрутки, использующей HTML и CSS. Несмотря на то, что в демо вы можете видеть, что в нем есть только контейнер с полосой прокрутки. Но после добавления содержимого клиент может просматривать статью, и мы видим, что полоса прокрутки смотрит вместе со статьей.
Это типичный вид полосы прокрутки. Базовое использование лингвистической структуры помогает использовать полосу прокрутки для действий.
Эти полосы прокрутки обычно не предназначены для любых браузеров. Мы видим незначительное использование компонентов в коде, а базовый CSS упрощает настройку.
Демонстрация/Код
9. Пользовательская полоса прокрутки Webkit с переходом
Это пользовательская полоса прокрутки для приложения, которая работает как локальная полоса прокрутки. Полоса прокрутки видна только тогда, когда мышь перемещается по статье. Модель включает в себя весь документ, поэтому клиент может его получить. Использование CSS понятно.
Это может быть настоящий случай полосы прокрутки. Мы можем настроить стиль полосы прокрутки из самого кода. Также код указан непосредственно под ним.
Демонстрация/Код
10. Пользовательский стиль полосы прокрутки – CSS и JS
Здесь вы можете увидеть различные стильные решения, которые можно использовать для правильной полосы прокрутки.
Полоса прокрутки выглядит привлекательно. Удары также плавные и чистые, без люфта, с помощью которых вы можете добиться заметного эффекта в своем бизнесе. В демоверсии вы можете увидеть различные конструкции с отличной заливкой фундамента.
Вся структура кода представлена вам непосредственно для лучшего практического понимания, вы можете проверить информационную ссылку. Вы также можете настроить их самостоятельно. Это еще один пример пользовательской полосы прокрутки с другим стилем и цветом с помощью css и javascript.
Демонстрация/Код
11. Кроссбраузерная горизонтальная видимая полоса прокрутки CSS
Все это время мы только что обсуждали вертикальные полосы прокрутки. Теперь пришло время использовать горизонтальную полосу прокрутки css. Как и в демонстрации, вы можете видеть как вертикальные, так и горизонтальные полосы прокрутки, чтобы увидеть все содержимое страницы. Если ваше содержание длинное и не выглядит неуместным, вы можете добавить его на свой веб-сайт.
Демонстрация/Код
12. Центральное положение прокрутки (по горизонтали и вертикали):
Это еще один пример горизонтальной полосы прокрутки с использованием Css и JavaScript. Полоса прокрутки идеальна и проста, поэтому их можно эффективно включить в действия. JavaScript выполняет всю основную работу. Это источник информации. Затем информация передается в HTML.
Это настоящий случай полосы прокрутки JavaScript. Мы можем переделать стиль полосы прокрутки из записи javascript.
Демонстрация/Код
13. HTML CSS Пользовательская полоса прокрутки
Эта пользовательская полоса прокрутки представляет собой еще один дизайн полосы прокрутки, который не отличается от других дизайнов. Мы видим правильно спроектированную полосу прокрутки для прокрутки содержимого веб-страницы. Поскольку полоса прокрутки использует HTML и CSS для завершения, их, безусловно, будет проще использовать для вашего веб-сайта. Кроме того, настройка может быть выполнена самостоятельно и сделать его более правильным и привлекательным.
Демо/Код
14. Пример SimpleBar
Судя по названию, Simple ScrollBar — это простой пример полосы прокрутки, использующей CSS и JavaScript. Клиент может просматривать статью, и мы видим полосу прокрутки, просматривающую статью. Это обычная полоса прокрутки. Полоса прокрутки видна, только если указатель мыши находится внутри страницы содержимого.
Простое использование языковой структуры помогает сделать полосу прокрутки пригодной для использования в проектах. С помощью javascript полоса прокрутки становится значительно более интуитивно понятной.
Демо/Код
15. Пользовательские полосы прокрутки (CSS и JavaScript)
Черный цвет всегда выглядит броско. Тема в этом дизайне также темная. В демо вы можете увидеть три разных дизайна. Весь дизайн полос прокрутки выглядит завораживающе. Полосы прокрутки загораются при наведении на них мышки.
Настраиваемая полоса прокрутки доступна в демо-версии и исходном коде css. Мы всегда рады любым модификациям, чтобы ваши навыки могли вывести эти проекты на совершенно новый уровень.
Демонстрация/Код
16. Swiper Slider Scrollbar Event Change Slide Event with JavaScript:
Теперь мы подошли к тому моменту, когда мы обсудим различные конструкции полос прокрутки. Нехорошо давать одинаковые дизайны пользователям. В этом дизайне, прокручивая полосу прокрутки css, страница будет двигаться горизонтально. С правильным эффектом и цветом этот дизайн выглядит более увлекательно, чем другие.
Этот план является одним из самых известных благодаря настраиваемой полосе прокрутки в свете его особенностей. Кроме того, с дополнительными эффектами в коде css и javascript вы можете добавить дополнительный эффект этой горизонтальной полосе прокрутки.
Демо/Код
17. Тонкая и цветная полоса прокрутки
Как сказано в названии, этот дизайн представляет собой тонкую и цветную полосу прокрутки. Полоса прокрутки имеет некоторое пергаментное влияние на страницу для взаимодействия с клиентом. Вы можете увидеть содержимое вместе с вертикальной полосой прокрутки справа.
В дизайне используются коды HTML и JS. Так что вам не нужно понимать сложность JavaScript.
Демо/Код
18. HTML и CSS Exploding Letter
Пока это единственный анимированный дизайн. Дизайн начинается с очень удивительного анимированного эффекта. Мы видим карточную структуру с надписью «Открой меня». Также есть красная круглая кнопка, которая трясется при наведении. При нажатии на кнопку вся карточка взорвется и мы увидим страницу с полосой прокрутки.
Анимация очень красивая и привлекательная. Это обязательно привлечет пользователей.
Демонстрация/Код
19. Демонстрация пользовательской панели NiceScroll
Влияние конфигурации пользовательской полосы прокрутки css используется как оживляющий компонент, а также как средство для выражения вашего бизнеса. Вы можете использовать эти полосы прокрутки на любых ваших сайтах. Если вы включаете оттенки и изменяете компоненты, вы также можете использовать это влияние положительно. Поскольку у нас, людей, чрезвычайно мало возможностей сосредоточиться на восьми секундах, наше усилие должно привлечь внимание клиента в течение секунды.
Демонстрация/Код
Заключение
У нас есть несколько полос прокрутки, которые мы можем использовать в нашем предприятии. Точно так же некоторые CSS и некоторые используют JavaScript, но каждый из них адаптируется. Полоса прокрутки приобретает прямолинейность, глядя сквозь экран. Некоторое использование также влияет на движение. Настоящая подсветка полосы прокрутки должна быть легкой, так как она выглядит гладкой. Так же, как он должен работать как локальная полоса прокрутки. Поддержка программы «все включено» сделает полосу прокрутки доступной для каждой программы. Пользовательская полоса прокрутки может быть чрезвычайно полезной, поскольку мы можем использовать полосу прокрутки в соответствии с нашими потребностями. Несмотря на то, что решений куча, мы должны выбрать безупречную, легкую и гладкую полосу прокрутки для нашего проекта.
Однако вы можете сделать дизайн более интерактивным, используя больше html5, css3, bootstrap и многое другое.
полоса прокрутки попутного ветра — npm
Добавляет утилиты стиля для полос прокрутки в Firefox и браузерах на основе webkit.
Установка
yarn add -D tailwind-scrollbar
или
npm install --save-dev tailwind-scrollbar
Добавьте его в массив плагинов вашей конфигурации Tailwind.
плагинов: [
// ...
требуют('попутный ветер-полоса прокрутки'),
], Использование
NB: Этот плагин стилей полос прокрутки; это не заставляет их появляться. Используйте типичные приемы CSS, чтобы заставить содержимое переполняться и запускать полосу прокрутки.
Для каждого элемента, который вы хотите стилизовать, добавьте класс полосы прокрутки или с тонкой полосой прокрутки . Затем вы можете добавить любые классы scrollbar-track-{color} , scrollbar-thumb-{color} или hover:scrollbar-thumb-{color} , которые вам нравятся. (Обратите внимание, что hover:scrollbar-thumb-{color} классы действуют только в браузерах на основе webkit.
)
Если вы используете как вертикальную, так и горизонтальную полосы прокрутки, вы можете заметить появление белого квадрата. Вы можете изменить его цвет с помощью утилиты
Вот минимальный пример (имея в виду, что классы h-32 и h-64 предназначены только для принудительного отображения полосы прокрутки):
<дел>Живую версию этой демонстрации можно найти здесь.
Конфигурация
Этот плагин может добавлять утилиты для создания закругленных полос прокрутки, ссылаясь на настроенные вами параметры радиуса границы. Однако, поскольку они поддерживаются только в браузерах на основе хрома, их использование в кроссбраузерных приложениях нежелательно. Чтобы включить утилиты скругленной полосы прокрутки, передайте
плагину во время его объявления; например:nocompatible: true плагины: [ // ... требуют('Полоса прокрутки попутного ветра')({несовместимо: правда}), ],Это добавит утилиты, такие как
scrollbar-thumb-roundedилиscrollbar-thumb-rounded-md.Полный список утилит
Все утилиты совместимы с вариантами, если не указано иное.
Утилиты ширины
Эти утилиты инициализируют стиль полосы прокрутки. Вам всегда нужен один из них, даже если вы используете нестандартную ширину. (См. ниже.)
Коммунальные услуги Эффект Примечания полоса прокрутки Включает пользовательский стиль полосы прокрутки, используя ширину по умолчанию В Firefox это scrollbar-width: auto, то есть16px. Chrome жестко запрограммирован на16pxдля согласованности.тонкая полоса прокруткиВключает пользовательский стиль полосы прокрутки с использованием тонкой ширины В Firefox это scrollbar-width: thin, то есть8px. Chrome жестко запрограммирован на8pxдля согласованности.полоса прокрутки - нетПолностью скрывает полосу прокрутки Из-за особенностей браузера это нельзя использовать для скрытия существующей стилизованной полосы прокрутки, т. е. полоса прокрутки hover:scrollbar-noneне будет работать.Цветовые утилиты
Все звездочки можно заменить любым цветом попутного ветра, включая произвольные значения и модификаторы непрозрачности. За исключением утилит ширины, все утилиты наследуются дочерними элементами.
Коммунальные услуги Эффект Примечания полоса прокрутки-*Задает цвет бегунка полосы прокрутки полоса прокрутки-*Задает цвет дорожки полосы прокрутки полоса прокрутки-угол-*Задает цвет угла полосы прокрутки Угол появится, только если у вас есть как вертикальная, так и горизонтальная полосы прокрутки. Несовместимые утилиты
Эти стили доступны только в режиме
несовместимо с. Они не будут иметь никакого эффекта в Firefox.
Коммунальное хозяйство Эффект Примечания полоса прокрутки-w-*Задает ширину вертикальных полос прокрутки Звездочку можно заменить любой настройкой ширины попутного ветра, включая произвольные значения. Применяется только к полосам прокрутки со стилем полоса прокрутки(нетонкая полоса прокрутки).полоса прокрутки-h-*Устанавливает высоту горизонтальных полос прокрутки Звездочку можно заменить любой настройкой высоты попутного ветра, включая произвольные значения. Применяется только к полосам прокрутки в стиле полосы прокрутки (неполоса прокрутки).полоса прокрутки-*Скругляет углы большого пальца полосы прокрутки Звездочка может быть заменена любой округленной настройкой попутного ветра, включая произвольные значения.
