Убрать/изменить обводку кнопок при нажатии.

Тема в разделе "Дизайн, оформление и шаблоны", создана пользователем АлексейК, 1 апр 2016.

  1. АлексейК

    АлексейК Новичок

    Сообщения:
    11
    Симпатии:
    0
    Друзья! Вопрос:
    Поменял цветовую схему дефолтного шаблона с голубого на красный. Все собственно получилось за исклчюением одного момента - при нажатии кнопки "Купить" и "Поиск" появляется классическая голубая обводка. Собственно и с кнопкой в корзине "Удалить" то же самое. Прошерстил все CSS - голубого цвета ни в каком виде там не осталось. Тем не менее, проблема имеется. Так же, если основную фотографию товара кликнуть и закрыть потом открывшееся изображение, вокруг главной фотографии кроме красной рамки появляется еще и дефолтная голубая. Кто подскажет, как исправить этот косяк? Как ее убрать вообще???
    2016-04-01_15-08-35.png 2016-04-01_15-09-25.png 2016-04-01_15-10-01.png 2016-04-01_15-10-28.png
     
    Последнее редактирование: 1 апр 2016
  2. АлексейК

    АлексейК Новичок

    Сообщения:
    11
    Симпатии:
    0
    Подскажите еще, откуда цвета тянутся в списки (см. аттач). 2016-04-01_15-58-32.png
     
  3. Ален

    Ален Эксперт

    Сообщения:
    2.056
    Симпатии:
    640
    проинспектировать элемент средствами браузера теперь запрещено ? ))

    Прописать стили для :active и :focus
     
  4. АлексейК

    АлексейК Новичок

    Сообщения:
    11
    Симпатии:
    0
    С ободками кнопок вопрос решил так (по-любому кто-то будет еще искать):
    в stylesheet/stylesheet.css шаблона добавил код
    Код:
    button:active, button:focus {
      outline: none !important;
    }
    button::-moz-focus-inner {
      border: 0 !important;
    }
    обводка пропала. Насколько это технически правильно - вопрос другой. :)
     
  5. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.570
    Симпатии:
    435
    Технически правильно, но те кто используют !important не понимают css, а именно иерархию стилей.
    !important - используется ну в очень редких случаях, когда уже не помогает иерархия и нужно поступить совсем не стандартно.
     
  6. optimlab

    optimlab Продвинутый пользователь

    Сообщения:
    924
    Симпатии:
    240
    Не правильно!!! Новичкам не смотреть!!!
     
    Последнее редактирование: 3 апр 2016
  7. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.570
    Симпатии:
    435
    Мне кажется что технически верным становиться все то что работает. Здесь уже зависит от подхода мастера и понимание на сколько четко, кратко и ясно описать стиль, а также не забыть про кроссбраузерность. Ни каждый знает что псевдокласс before: быстрее отрендириться чем after - уже совсем другая тема.
    HTML:
    .btn:focus {outline:none;} - убирает синие поле.
    .btn:active {box-shadow: none;} - убирает тень внутри кнопки
    .btn {border:none;} - убирает линию границ кнопки
     
    Последнее редактирование: 3 апр 2016
    АлексейК нравится это.
  8. optimlab

    optimlab Продвинутый пользователь

    Сообщения:
    924
    Симпатии:
    240
    А если они так начнут писать: style=" "
    Можно еще теги не закрывать, браузер проигнорит ошибку и это будет работать...

    Просто я подхожу к совету и решению на форуме с той позиции, что это решение возможно увидит новичок и у него могут возникнуть ошибки если у кнопки в шаблоне есть свой класс. Потом не поняв ничего что твориться, он создаст аналогичную тему и сошлется на решение, которое якобы было правильным....
    К примеру на форуме можно очень часто встретить задание свойства display:none , через создание своего класса, хотя этот класс давно определен в бутстрап, или использование аналогичного класса от бутстрап2.
    Вообщем вы поняли...
     
    solunski.d нравится это.