Как изменить цвет при наведении на кнопку css

I need to change the color of a button on hover. Here is my solution, but it doesn't work. a.button { display: -moz-inline-stack; display: inline-block; width: 391px; height: 62px;

I need to change the color of a button on hover.

Here is my solution, but it doesn’t work.

a.button {
   display: -moz-inline-stack;
   display: inline-block;
   width: 391px;
   height: 62px;
   background: url("img/btncolor.png") no-repeat;
   line-height: 62px;
   vertical-align: text-middle;
   text-align: center;
   color: #ebe6eb;
   font-family: Zenhei;
   font-size: 39px;
   font-weight: normal;
   font-style: normal;
   text-shadow: #222222 1px 1px 0;
}
a.button a:hover{
     background: #383;
}

freedomn-m's user avatar

freedomn-m

26.8k8 gold badges34 silver badges55 bronze badges

asked Oct 10, 2010 at 2:37

getaway's user avatar

a.button a:hover means «a link that’s being hovered over that is a child of a link with the class button«.

Go instead for a.button:hover.

answered Oct 10, 2010 at 2:39

Matchu's user avatar

MatchuMatchu

82.8k18 gold badges152 silver badges160 bronze badges

0

Seems your selector is wrong, try using:

a.button:hover{
     background: #383;
}

Your code

a.button a:hover

Means it is going to search for an a element inside a with class button.

answered Oct 10, 2010 at 2:40

BrunoLM's user avatar

BrunoLMBrunoLM

96.4k82 gold badges297 silver badges449 bronze badges 

a.button:hover{
    background: #383;  }

works for me but in my case

#buttonClick:hover {
background-color:green;  }

answered May 25, 2016 at 12:56

Penh's user avatar

Источник

🗓️ Обновлено: 30.01.2022

💬Комментариев:
0

👁️Просмотров: 7053

Поменяем цвет фона и текста у кнопки при наведении.

Будем использовать два способа. Первый — просто меняем фон и цвет у кнопки. Второй — меняем фон кнопки с помощью псевдоэлемента :before

Кнопка внутри формы (button type=»submit»)

Просто меняем фон и цвет:

See the Pen
#1 Просто меняем фон и цвет кнопки — button type=»submit» by Pelegrin (@pelegrin2puk)
on CodePen.

Меняем через псевдоэлемент :before (обратите внимание на span, который нужно разместить внутри кнопки):

See the Pen
Меняем фон с помощью :before — button type=»submit» by Pelegrin (@pelegrin2puk)
on CodePen.

Кнопка внутри формы (input type=»submit»):

Тот же самый принцип, что и выше, но вместо button[type=»submit»] нужно в css прописать input[type=»submit»]

Кнопка, как отдельный элемент в html кода:

Просто меняем фон и цвет:

See the Pen
Изменить цвет кнопки — обычный div by Pelegrin (@pelegrin2puk)
on CodePen.

А теперь меняем цвет, с помощью псевдоэлемента :before

See the Pen
Изменить цвет кнопки с помощью :before — обычный div by Pelegrin (@pelegrin2puk)
on CodePen.

Кнопка в Bootstrap

Чтобы изменить цвет кнопки в Bootstrap, вам необходимо найти нужный класс (или id), а также нужный порядок вложенности элементов.

К примеру, у вас есть кнопка 

<button type="button" class="btn btn-outline-primary">Primary</button>

И вы хотите изменить для нее цвет при наведении. Тогда я бы рекомендовал в css прописать следующее:

.btn.btn-outline-primary:hover {
  background: red; /* Либо любой другой цвет */
  /* А также заменил бы цвет и для border */
}

Как изменить цвет кнопки с помощью Js

Я покажу два варианта, как поменять цвет кнопки при наведении используя JavaScript.

Первый вариант — мы будем добавлять класс с нашей кнопки через js:

See the Pen
YzWmEGX by Pelegrin (@pelegrin2puk)
on CodePen.

Второй вариант — мы будем менять css стили прямо в js:

See the Pen
#2 Меняем цвет кнопки c помощью JS — меняем стили внутри JavaScript by Pelegrin (@pelegrin2puk)
on CodePen.

Надеюсь, я помог вам разобраться, как можно изменить цвет кнопки при наведении на нее курсором. В заключении рекомендую посмотреть видео, чтобы окончательно развеять все вопросы.

Источник

В этом туториале вы сначала заставите кнопку менять цвет по наведению мыши, а затем привяжите анимацию к внешнему тегу:

1. Как оживить кнопку

Очень советуем не просто читать туториал, а выполнять его вместе с нами, шаг за шагом. Так материал быстрее усвоится и повторить его будет проще.

1.1. Запустите стартовый шаблон

Для начала возьмите наш стартовый шаблон с кнопкой красного цвета, сохраните к себе в файл и откройте в браузере:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style type="text/css">
      .animated-btn {
        background-color: red;
      }
    </style>
  </head>
  <body>
    <button class="animated-btn">Кнопка</button>
  </body>
</html>

В браузере должна получиться такая кнопка. Как видите, на наведение мыши она не реагирует:

1.2. Добавьте класс с новым стилем

Для начала попробуйте поменять цвет кнопки в принципе, без наведения. Сложность здесь в том, что старое CSS-правило надо сохранить: красный цвет должен вернуться кнопке, когда вы уберёте от неё курсор мыши.

Сейчас создайте второе CSS-правило для той же кнопки. Поместите новое правило ниже первого.

.animated-btn {
  background-color: red;
}
.animated-btn {
  background-color: blue;
}

Откройте Инструменты разработчика браузера, и вы увидите, что оба правила сработали. Оба правила меняют стиль background-color и поэтому второе перекрыло первое:

Кнопка стала синего цвета. Теперь научите её реагировать на движение мыши.

1.3. Добавьте :hover

Теперь дело за малым: добавьте новому селектору ключевое слово :hover. Да, вот так просто:

.animated-btn {
  background-color: red;
}
.animated-btn:hover {
  background-color: blue;
}

Теперь кнопка меняет цвет при наведении:

Ключевое слово :hover называют псевдоклассом. Подобно классу его можно использовать в селекторе. Но, в отличии от класса, он динамичен — браузер словно добавляет hover тому тегу, на который сейчас указывает стрелка мыши и забирает при потере наведения.

Правило .animated-btn:hover говорит браузеру: Ищу тег с классом animated-btn, и чтобы на него смотрел указатель мыши. Когда мышь наведена на кнопку, то правило срабатывает. Как только мышь перемещается на другой тег — перестаёт.

Псевдокласс :hover появляется и исчезает при движении мыши

Есть ещё одна особенность у :hover. Псевдокласс получает не только один тег, но все его родители. В примере с кнопкой это будут сразу два тега <button> и <body>:

...
<body>
    <button class="animated-btn">Кнопка</button>
...

1.4. Добавьте больше стилей

Очевидно, что вместо смены цвета вы могли поменять кнопку как угодно. Например, добавить ей тень:

2. Как расширить область hover

Менять кнопку при наведении вы научились. А что, если вы хотите менять кнопку по наведению мыши на тег рядом с ней?

2.1. Запустите стартовый шаблон

Используйте наш стартовый шаблон, это красная кнопка внутри зелёного квадрата:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style type="text/css">
      .animated-btn {
          background-color: red;
      }
      .btn-wrapper {
          height: 100px;
          width: 100px;
          background-color: green;
          display: flex;
          align-items: center;
          justify-content: center;
      }
    </style>
  </head>
  <body>
    <div class="btn-wrapper">
      <button class="animated-btn">Кнопка</button>
    </div>
  </body>
</html>

Выглядит это примерно так:

2.2. Добавьте класс с новым стилем

Давайте сделаем кнопку синей. Но, на этот раз, при написании селектора сперва, выберите зелёный контейнер, а уже потом кнопку внутри него. Добавьте такое правило:

.btn-wrapper .animated-btn {
    background-color: blue;
}

Результат:

2.3. Добавьте :hover

На этот раз :hover должен достаться селектору для зелёного прямоугольника:

.btn-wrapper:hover .animated-btn {
    background-color: blue;
}

Понять как работает селектор можно, прочитав его задом наперёд: Найди элемент с классом animated-btn, да такой, чтобы среди родителей у него был элемент с классом btn-wrapper и мышь была наведена на этого родителя. Вот как это выглядит в действии:

3. Что делать, если не получилось

Бывает такое, что пишешь анимацию, а она всё равно не работает. И что делать?

3.1. Проверьте, что один элемент внутри другого

Зайдите в Chrome Dev Tools и найдите элемент, к которому подключаете анимацию. Он точно внутри нужного тега?

3.2. Проверьте селектор

На вкладке Elements в Chrome Dev Tools нажмите комбинацию клавиш Ctrl+F. Откроется поле для поиска тегов. Вбейте туда свой селектор и нажмите Enter. Нужный тег должен подсветиться жёлтым цветом. Если этого не произошло, то ваш селектор написан неправильно.

3.3. Проверьте стили

Возможно ваш стиль просто не работает. Уберите :hover и проверьте, что стиль срабатывает правильно хотя бы без анимации.

Читать дальше

  • Какие существуют псевдоклассы
  • Полный список псевдоклассов на MDN (en)
  • Специфичность селекторов
Источник

Три эффекта наведения на кнопку

Три эффекта наведения на кнопку

На этом уроке мы разберем три разных эффекта при наведении на кнопку.

Посмотрите демо на CodePen

HTML разметка

Создадим в разметке три разных блока и и обернем в контейнер с классом wrapper для выравнивания их по центру. Один блок — одна кнопка.


<div class="wrapper">
    <div class="buttonLeft"><span>Left</span></div>
    <div class="buttonOverlay"><span>Center</span></div>
    <div class="pressDown"><span>Right</span></div>
</div>

Замена цвета кнопки при наведении (эффект 1)

Создадим кнопку слева.


.buttonLeft {
    border-radius: 5px; // скругление
    padding: 0 40px; //поля внутри кнопки
    overflow: hidden; // скрыть все что выходит за родителя
    background: #BA7BA1; // цвет кнопки
    position: relative; // установим позицию родителя
    line-height: 40px;
    color: #fff; // цвет текста
    margin-right: 40px; // промежуток между кнопками
}

В качестве заполнения кнопки другим цветом, будет служить псевдоэлемент before. Однако увидеть, как происходит плавная замена одного цвета на другой, можно будет только при наведении на кнопку. Весь фокус состоит в трансформации псевдоэлемента before: из невидимой (-100%) позиции в состоянии покоя в видимую (0) при наведении.


.buttonLeft::before {
    content: '';
    position: absolute; // позиционировать относительно родителя
    left: 0; // координата псевдоэлемента
    bottom: 0;
    width: 100%;
    height: 100%;
    transform: translateX(-100%); // прячем псевдоэлемент за родителем
    background: #EC008C; // новый цвет
    transition: transform .2s ease-in-out; // плавная анимация
}

.buttonLeft:hover::before {
    transform: translateX(0); // показываем псевдоэлемент
}

.buttonLeft span {
    position: relative;
    z-index: 1; // текст сверху
}

Три эффекта наведения на кнопку.

Изменение положения кнопки при наведении (эффект 2)

При наведении мыши на центральную кнопку, нужно выпавшую кнопку вернуть обратно в рамку.


// задаем позиционирование
.buttonOverlay {
    padding: 10px 25px;
    position: relative;
    color: #fff;
    margin-right: 40px;
}

// рисуем выпавшую кнопку
.buttonOverlay::before {
    content: '';
    position: absolute;
    border-radius: 5px;
    height: 100%;
    width: 100%;
    top: 5px;
    right: 5px;
    background-color: #BA7BA1;
    z-index: -1;
    transition: transform .2s ease-in-out;
}

// рисуем пустую рамку
.buttonOverlay::after {
    content: '';
    border-radius: 5px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    border: 1px solid #EC008C;
}

// при наведении возвращаем кнопку в свою рамку
.buttonOverlay:hover::before {
    transform: translate(6px, -4px);
}

Три эффекта наведения на кнопку.

Нажатая вниз кнопка при наведении (эффект 3)

Этот эффект напоминает сжатую пружину при наведении мыши. Когда мы уводим мышь с кнопки, то пружина отжимается. Весь секрет в обнулении толщины нижней рамки при наведении.


.pressDown {
    background-color: #BA7BA1;
    padding: 10px 30px;
    color: #fff;
    border-radius: 5px;
    border-bottom: 4px solid #EC008C;
    transition: 0.1s;
}

.pressDown:hover{
    border-bottom-width: 0; // обнуление толщины рамки
    margin-top: 3px;
}

Три эффекта наведения на кнопку.

  • Создано 11.05.2020 10:03:11


  • Михаил Русаков

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):
Источник

В данном уроке рассматриваются четыре очень простых кнопки CSS с эффектами анимации при наведении курсора мыши на них.

demosourse

Общие установки

Прежде чем разбираться с кнопками, рассмотрим общие для всех них установки.

HTML

Для кнопок будет использоваться очень простой HTML код:

<a href="#" id="button2" class="buttonText">Подписаться</a>

CSS

Также все кнопки будут иметь общие установки для текста надписи и отмену выделения ссылок:

.buttonText {
  font: 18px/1.5 Helvetica, Arial, sans-serif;
  color: #fff;
}
 
a {
  color: #fff;
  text-decoration: none;
}

Увеличивающаяся кнопка

Увеличивающаяся кнопка

Обычно, пользователь ожидает достаточно мягкого эффекта при навдении курсора мыши на ссылку или кнопку. А  в нашем случае кнопка меняет размер — она увеличивается, показывая дополнительное сообщение.

Основной код CSS

Для начала нам нужно только задать кнопке форму и цвет. Определяем высоту 28px и ширину 115px, добавляем поля и отступы, а также задаем  кнопке светлую рамку.

#button1 {
  background: #6292c2;
  border: 2px solid #eee;
  height: 28px;
  width: 115px;
  margin: 50px 0 0 50px;
  padding: 0 0 0 7px;
  overflow: hidden;
  display: block;
}

Эффекты CSS3

Некоторым людям нравится, когда простая кнопка сопровождается достаточно большим кодом CSS. В данном разделе приводятся дополнительные стили CSS3 для нашей кнопки. Вполне можно обойтись и без них, но они придают кнопке более современный вид.

Округляем углы рамки и добавляем градиент. Здесь используется небольшой трюк с темным градиентом, который взаимодействует с любым цветом фона.

  /*Скругленные углы*/
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  
  /*Градиент*/
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));

Анимация CSS

Теперь установим переход CSS. Анимация будет использоваться для любых изменений свойств и длиться полсекунды.

  /*Переход*/
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;

Наведение курсора мыши

Осталось только добавить стиль для расширения кнопки при наведении курсора мыши на нее. Кнопка должна иметь ширину 230px для отображения всего сообщения.

#button1:hover {
  width: 230px;
}

Простое изменение тональности цвета

Изменение тональности цвета кнопки

Очень простой и популярный эффект CSS для кнопки. При наведении курсора мыши плавно меняется тональность фонового цвета.

Основной код CSS

Код CSS очень похож на предыдущий пример. Используется другой цвет фона и немного изменена форма. Также центрируется текст и установлена высота строки для кнопки, чтобы происходило вертикальное центрирование.

#button2 {
  background: #d11717;
  border: 2px solid #eee;
  height: 38px;
  width: 125px;
  margin: 50px 0 0 50px;
  overflow: hidden;
  display: block;
  text-align: center;
  line-height: 38px;
}

Эффекты CSS3

Устанавливаем скругление углов, градиент для фона и дополнительную тень. С помощью rgba делаем тень черной и прозрачной.

  /*Скругленные углы*/
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  
  /*Градиент*/
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  
  /*Тень*/
  -webkit-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);

Анимация CSS

Анимация практически не отличается от предыдущего примера.

  /*Переход*/
  -webkit-transition: All 0.5s ease;
  -moz-transition: All 0.5s ease;
  -o-transition: All 0.5s ease;
  -ms-transition: All 0.5s ease;
  transition: All 0.5s ease;

Наведение курсора мыши

При наведении курсора мыши будет устанавливаться другой цвет фона. Попробуйте выбрать более светлый вариант цвета в Photoshop, чтобы получился отличный эффект.

#button2:hover {
  background-color: #ff3434;
}

Сдвиг фонового изображения

Сдвиг фонового изображения

Данный эффект может получиться весьма впечатляющим в зависимости от выбора фонового изображения. В демонстрации используется невзрачный фон и эффект выглядит невзрачно. Попробуйте использовать другую картинку и может получиться ошеломляющий эффект.

Основной код CSS

Основная часть кода не отличается от предыдущих примеров. Обратите внимание на то, что мы используем фоновое изображение. Начальное положение фона установлено в «0 0». При наведении курсора положение сдвигается по вертикали.

#button3 {
  background: #d11717 url('bkg-1.jpg');
  background-position: 0 0;
  text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.3);
  font-size: 22px;
  height: 58px;
  width: 155px;
  margin: 50px 0 0 50px;
  overflow: hidden;
  display: block;
  text-align: center;
  line-height: 58px;
}

Эффекты CSS3

В данном примере нет ничего особенного — скругленные углы и тени.

  /*Скругленные углы*/
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
  /*Тень*/
  -webkit-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 3px 1px rgba(0, 0, 0, 0.2);

Анимация CSS

Анимация для данного случая длится дольше, чтобы создать плавный и интересный эффект.

  /*Переход*/
  -webkit-transition: All 0.8s ease;
  -moz-transition: All 0.8s ease;
  -o-transition: All 0.8s ease;
  -ms-transition: All 0.8s ease;
  transition: All 0.8s ease;

Наведение курсора мыши

Теперь пришла пора сдвигать фоновое изображение. Начальное положение было «0 0». Устанавливаем второй параметр в значение 150px. Для сдвига по горизонтали требуется изменить первый параметр.

#button3:hover {
  background-position: 0px 150px;
}

3D имитация нажатия кнопки

Имитация нажатия кнопки

Последний пример в нашем уроке посвящен популярному методу 3D имитации нажатия кнопки при наведении на нее курсора мыши. Анимация для данного случая настолько проста, что даже не требуется задавать переход CSS. Но конечный результат получается вполне впечатляющим.

Основной код CSS

Код CSS для нашей кнопки.

#button4 {
  background: #5c5c5c;
  text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.3);
  font-size: 22px;
  height: 58px;
  width: 155px;
  margin: 50px 0 0 50px;
  overflow: hidden;
  display: block;
  text-align: center;
  line-height: 58px;
}

Эффекты CSS3

В данном случае CSS3 перестает быть приятным опционом. Для получения эффекта требуются тени и градиент. Резкая тень создает видимость 3D кнопки.

  /*Скругленные углы*/
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
  /*Тень*/
  -webkit-box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);
  box-shadow: 0px 6px 0px rgba(0, 0, 0, 0.8);
  
  /*Градиент*/
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));

Наведение курсора мыши

В данном случае мы имеем самую большую секцию hover. Длина тени уменьшается, и с помощью полей создается смешение темной зоны. Все вместе создает иллюзию нажатия кнопки. Переворот градиента усиливает эффект.

#button4:hover {
  margin-top: 52px;
  
  /*Тень*/
  -webkit-box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.8);
  box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.8);
  
  /*Градиент*/
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
  background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
  background-image: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
  background-image: linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
}
Источник

Понравилась статья? Поделить с друзьями:

Читайте также:

  • Как изменить цвет префикса на сервере майнкрафт
  • Как изменить цвет почты outlook
  • Как изменить цвет портфеля
  • Как изменить цвет поля ввода
  • Как изменить цвет полоски пуск виндовс 10

    • 0 0 голоса
    Рейтинг статьи
    Подписаться
    Уведомить о
    guest

    0 комментариев
    Старые
    Новые Популярные
    Межтекстовые Отзывы
    Посмотреть все комментарии