Как убрать cинюю обводку у фотографии?

Question

[alcufa]

Добрый день.
Есть страница, на который через визуальный редактор добавлены фотографии. После нажатия на фото и закрытия появляется такая синяя обводка. Помогите победить
prntscr.com/7cjb47
Сайт сделан на Yii, код в редакторе выглядит так

<h1>Кованые мостики</h1>

<p>Изящность, визуальная легкость и благородство &ndash; все это делает декоративный мостик ...</p>

<p>Кованый мостик подчеркнет высокий статус, чувство стиля и утонченного вкуса владельца участка ...</p>

<p>
<a href="#"><img alt="" src="#" style="width: 212px; height: 159px; margin-right: 10px; margin-left: 10px;" /></a>
<a href="#"><img alt="" src="#" style="width: 212px; height: 159px; margin-right: 10px; margin-left: 10px;" /></a>
<a href="#"><img alt="" src="#" style="width: 212px; height: 140px; margin: 10px;" /></a>
<a href="#"><img alt="" src="#" style="width: 212px; height: 140px; margin: 10px;" /></a>
</p>

<p>Декоративные мостики из кованого металла удачно сочетают эстетичность с добротностью и долговечностью ...</p>

Answer 1

[Денис Инешин]

a, a > img {
    border: 0;
    outline: 0;
    box-shadow: none;
}

Попробуйте

Comments

[Евгений Петров]

Теперь пытаемся переходить по активным элементам с помощью Tab и покрываем матом разработчика.

[Денис Инешин]

Евгений Петров: ну каждому свое)

[Евгений Петров]

Убирать обводку нужно только у тех элементов, навигация по которым не будет производиться, или если реализованы другие способы демонстрации активного элемента.
А повальная отмена обводки у активных элементов — жесть.

[Денис Инешин]

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

[chupok]

Евгений Петров: a img {border: 0} достаточно, по-моему. Кстати, по поводу обводки интересное решение представлено в БЭМ-технологии, где обводка элементов изначально отменяется, а при фокусировке к требуемой сущности цепляется класс с соответствующими свойствами. Таким образом фокус становится более "кроссбраузерным" (в кавычки специально взял словцо). Однако некоторые специалисты считают лишним, как я слышал, вообще само понятие кроссбраузерности, аргументируя это тем, что пользователь привыкает к стандартным стилям браузера. За оффтоп прошу прощения, но интересно услышать ваше мнение (часто обращаю внимание на ваши ответы). Спасибо!

[Евгений Петров]

chupok: Накопленный опыт (а это и есть UX) безусловно имеет важнейшую роль. Однако, взаимодействие с элементами неоднородно, и тоже подвержено классификации.

Скажем, при нажатии на кнопку я привык видеть синюю рамку, а мне показывают изменение цвета на другой. Насколько сильно будет воздействие на человека с опытом? Думаю, не слишком велико (хотя и это желательно проверить).
Однако, несмотря на достаточно быструю приспособляемость, не стоит злоупотреблять заменой штатных средств браузера в угоду универсальному виду. Где-то стандартная рамка будет неуместна, а где-то вполне себе.

Я вообще не разделяю унитарных подходов — делаем только так и никак иначе. Я не против отмены штатного выделения по необходимости, но всегда нужно помнить о навигации с помощью Tab, о порядке следования ссылок и элементов формы. О глючности эмуляции :hover на тач-устройствах, да о многом.

Кстати, не понял про класс — вполне достаточно псевдоклассов.

[chupok]

Евгений Петров: о классах. В этом состоит особенность самой методологии, где с помощью классов создаются также и уровни переопределения (на мобильном подключается один класс, на ПК - другой), например. В качестве образца можете посмотреть, как выполнены кнопки в библиотеке компонентов: https://ru.bem.info/libs/bem-components/v2.1.1/des...