Как в опере убрать рамки в
12 августа 2010
Opera, в отличие от IE, не так часто «радует» странностями, но иногда, как и у остальных браузеров, случается.
Тестовый наборчик (воспроизводится на последнем релизе, Windows)
При фокусе на input[type=text] вокруг submit появляется чёрная однопиксельная рамка. Так как для кнопки использован border-radius, а рамка у нас прямоугольная, логично предположить, что это не border. Также проверил, что это не outline.
Вадим Макеев подтвердил, что это такая фича, означающая, что форма в данный момент находится в фокусе, а кнопка с чёрной рамочкой её сабмитит. Работает это таким образом только на Windows. Ну и так как такое поведение желательно не всегда, в будущих версиях рамочка либо будет убрана совсем, либо будет документирована и её будет возможно убрать.
Пока же единственный способ решить данную проблему — обернуть кнопку дополнительным элементом, задать самой кнопке border: none, а обёртке соответствующий border и border-radius.
Комментарии RSS по email OK
Интересно, еще опера не поддерживает border-radius на ячейках таблицы и других элементах с display: table-cell
Еще года 2 не чинят баг, когда при наведении из js делаешь cursor: hand (или любой другой) он не меняется пока не отведешь мышку с элемента.
А баг-репорт отправлен?
по поводу курсора точно были и это довольно известный баг, а по поводу скруглений - не знаю, я не писал.
Рамка есть и в FreeBSD
White Shadow
Может они не знают? Стоит написать.
А если submit заменить на button, проблема остается?
В меньшей степени да. В любом случае submit — это не button.
в будущих версиях рамочка либо будет убрана совсем, либо будет документирована и её будет возможно убрать.
неплоха бы ещё дать возможность отключать подсвечивание полей, имена которых использовались при запоминании логина/пароля, а то временами оно очень не к месту
В Опере еще и size на input кардинально отличается (input намного длиннее) чем в IE или Firefox
Начал сегодня работать над формой авторизации на своем сайте и столкнулся с точно такой же проблемой, но пока ее не обошел (
В общем я тут тоже столкнулся с этой проблемой))) Выходит, что создатели браузеров не могут пока договориться о том как отображать кнопки. Мне стало интересно как вообще с этим бордюром борется сама Опера на своем сайте, в общем у них там все куда смешнее - они просто выключили это и все, да и вообще кнопка у них кнопка во всех положениях не проявляет никаких действий. Это я о форме авторизации, а в форме регистрации используют вместо input - button, ну для "батона" конечно все круто получается просто можно обойтись стилями css.
А вообще считаю, что конечному пользователю не особо важно как эта кнопка выглядит - главное чтоб функцию свою непосредственную выполняла. Конечно стилизация должна быть, но если не получается настроить этот бордюр то проще вообще от него отказаться - сделать кнопку как на сайте Оперы к примеру - просто и сердито, те кто ее делали не долго парились над решением проблемы)))))
И еще, сайт Оперы к примеру мне не очень нравится, все же коряво сделан - ну это я придираюсь потому что я бы что то сделал более стилизовано и красиво, а вот основной массе пользователь эти улучшения особо не нужны - ведь им важна основная функциональность и простота, а не супер пупер стильные кнопки.
Здравствуйте! После обновления,вверху браузера над вкладками,появилась рамка в несколько пикселей. При попадании курсора в эту рамку и нажатии для переключения вкладки ничего не происходит. Т.к. раньше переключал вкладки курсором почти не глядя,то теперь часто первого нажатия на вкладку бывает мало,приходится целится точнее :))) Это так и задумано было в этом обновлении,или у меня что-то не так установилось?
Да,галочка в настройке поставлена. Самое интересное,что попробовал несколько раз её убрать и снова поставить,при этом вообще никаких изменений не происходило.
Да,галочка в настройке поставлена. Самое интересное,что попробовал несколько раз её убрать и снова поставить,при этом вообще никаких изменений не происходило.
визуально и у меня ничего не изменяется, но вот на вкладку нажимать получается в самом ее верху - если галку поставить в настройке. Если убираю галку, то визуально все так же остаётся, но уже нажать не получается на вкладку в самом ее верху. Windows 8.1 x64
После обновления проблема с рамкой над вкладками исчезла,всё работает как надо. Спасибо разработчикам за оперативность!=) А простых пользователей прошу: хоть изредка благодарите тех,кто делает и старается делать нашу жизнь лучше,и не только в сфере IT=)
а как включить этот отступ для версии оперы для линукс?, там вообще не могу найти такого пункта
Как этот отступ выглядит?
@fonm вот так.
https://1drv.ms/u/s!Aslnmv0bFYjBj4MvtzlBUMhjTr7zQQ?e=mSTbJV
https://1drv.ms/u/s!Aslnmv0bFYjBj4MujpW6MOOZSyNy4w?e=fIhXjR
Нужно выключить пункт "Расположить вкладки вплотную краю экрана"
Где найти такой пункт в настройках? не могу найти. По сути, это одно из БОЛЬШИХ плюсов почему использую этот браузер. так как я могу в любом месте взять окно и перетащить его, а не искать какое-то свободное место, где нет вкладки. сейчас перетаскивается одна вкладка. это ужасно. окно не перетаскивается. нет пункта в настройках в опере для линукс. пакет deb
скрины из под виндовс
Где найти такой пункт в настройках? не могу найти.
На ум не приходило, что на разных платформах настройки разные? Может в винде или маке они есть, а в лине их попросту таких нет?
У меня так на xfce lxqt lxde
@fonm настройка есть? на эту тему о платформах. Разве линукс не позволяет это сделать?
@skorpions2000
Позволяет? Зачем тогда спрашивать?
Например,
opera://flags Unavailable
На ум не приходило, что на разных платформах настройки разные?
приходило естественно, для этого спрашиваю. Я не могу найти эту настройку, возможно она перемещена или скрыта. Раньше эта настройка была скрыта. Откуда я знаю как это у них реализовано. Я зашел здесь обсудить это. Это же форум?
здесь есть эта настройка? я не нашел ее здесь. перед тем как спросить я искал внимательно и здесь тоже и в обычных настройках. потом гуглил, но никакой информации не нашел. Нашел информацию о том, как включить и выключить эту функцию. Но я не могу это сделать так как не могу найти этой настройки. Есть ли данная настройка на линукс? Может нужно обновить браузер, я не знаю. Поэтому спрашиваю. Например, на маке окно выглядит иначе, да у них и панель сверху экрана есть, вот на линуксе выглядит все 1:1, даже окно завершения работы при открытых нескольких вкладках как из винды смешно выглядит, не соответствует настройкам интерфейса системы.
если эта настройка здесь, пожалуйста сообщите какое имеет название, может настройка называется как-то иначе
здесь есть эта настройка? я не нашел ее здесь. перед тем как спросить я искал внимательно и здесь тоже и в обычных настройках. потом гуглил, но никакой информации не нашел.
Не знаю.
Это был пример того, что не все настройки доступны под линь, даже если они экспериментальные.
@fonm спасибо за отклик, очень жаль, что браузер отличается. Но это несомненно откроет дополнительные возможности
@skorpions2000
Можно поискать здесь. Надежды мало, что там есть что-то.
Общеизвестно, оперу делали для тупых макак, а не для людей. Обидно конечно, но что поделать, такова се ля ви как говорят китайцы.
@fonm спасибо за ссылку, буду пробовать. Я оперой пользуюсь, честно говоря, с самого начала существования браузера, и не хотелось бы уходить с этой платформы, потому что нет какой-то востребованной для меня функции.
Браузер Opera состоит из пяти групп экранных элементов:
На панели меню для Mac доступны следующие элементы:
Панель вкладок позволяет переходить с одной страницы на другую при одновременном просмотре нескольких страниц. Нажмите на вкладку страницы, чтобы просмотреть ее содержимое. Чтобы открыть новую вкладку, нажмите кнопку + на панели вкладок.
С помощью кнопок навигации можно переходить на необходимые страницы браузера:
В области просмотра отображается содержимое страницы. Именно здесь вы взаимодействуете со страницей: читаете текст, просматриваете изображения, переходите по ссылкам и т.д.
Боковая панель
Боковая панель Opera – это быстрый доступ к пространствам, мессенджерам, закладкам, мой Flow, персональным новостям, вкладкам, истории, расширениям, загрузкам и настройкам.
Боковая панель может быть закреплена и видна на каждой странице браузера, или вы можете скрыть ее для удобства при просмотре других страниц. Сделать это можно через Easy Setup (Простые настройки).
Управление боковой панелью Opera
Чтобы настроить боковую панель, щелкните значок с тремя точками внизу боковой панели. Откроется панель настроек боковой панели, позволяющая редактировать или удалять элементы на боковой панели, такие как пространства, мессенджеры, историю, расширения, а также другие функции и инструменты.
Для доступа к настройкам боковой панели перейдите в меню Settings (Настройки) (Preferences (Настройки) на Mac) > Basic (Основные) > Sidebar (Боковая панель).
Вкладки
Opera может организовать несколько страниц в одном окне с помощью вкладок, которые напоминают ярлыки папок для бумаг. Вкладки позволяют работать одновременно с несколькими страницами, не закрывая страницу, пока она нужна.
Чтобы открыть новую вкладку, нажмите кнопку + на панели вкладок.
Щелкните правой кнопкой мыши на вкладку, чтобы открыть ее контекстное меню. В этом меню доступны следующее действия для вкладки:
- Создать вкладку
- Обновить
- Обновить все вкладки
- Копировать адрес страницы
- Дублировать вкладку
- Зафиксировать вкладку
- Переместить вкладку в пространство
- Выключить звук на вкладке
- Выключить звук на остальных вкладках
- Закрыть вкладку
- Закрыть другие вкладки
- Закрыть вкладки справа
- Закрыть вкладки справа
- Закрыть повторяющиеся вкладки
- Сохранить все вкладки как папку на Экспресс-панели
- Открыть последнюю закрытую вкладку
Перемещение по вкладкам
Функция перемещения по вкладкам – это всплывающее окно с предварительным просмотром вкладок, которое позволяет переключаться между миниатюрами открытых вкладок. Нажмите и удерживайте нажатой клавишу Ctrl, а затем нажмите клавишу «Tab», чтобы вызвать функцию. Нажмите на нужную вкладку или отпустите Ctrl, чтобы переключиться на выделенную в данный момент вкладку.
Предпросмотр содержимого вкладки
Чтобы просмотреть содержимое вкладки, не уходя с текущей страницы, можно навести указатель мыши на вкладку. Предпросмотр вкладок особенно удобен, если открыто много страниц. Включить предпросмотр вкладок можно в настройках Opera. Чтобы включить или выключить предпросмотр вкладок, выполните следующие действия:
- Перейдите в Settings (Настройки) (Preferences (Настройки) на Mac).
- Нажмите Browser (Браузер) на боковой панели.
- В разделе User interface (Интерфейс пользователя) установите флажок Show tab previews (Показывать миниатюры вкладок при наведении).
Закрытие вкладок
Чтобы закрыть вкладку, наведите на нее указатель мыши и нажмите кнопку x. Чтобы закрыть все вкладки, кроме текущей, удерживая Ctrl, нажмите левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) по текущей вкладке и выберите Close Other Tabs (Закрыть остальные вкладки) . Кроме того, можно закрыть все вкладки справа от текущей вкладки, нажав Close Tabs to the Right (Закрыть вкладки справа).
Если вы закрыли вкладку случайно или хотите открыть недавно закрытую вкладку, удерживая Ctrl, нажмите левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) по вкладке и выберите Reopen Last Other Tabs (Открыть последнюю закрытую вкладку).
Фиксация вкладок
Фиксация вкладок позволяет Opera предотвратить случайное закрытие вкладок или выделить важные страницы. Зафиксированная вкладка не может быть закрыта. Чтобы закрепить вкладку на панели вкладок или открепить ее, удерживая Ctrl, нажмите левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) по вкладке и выберите Pin Tab / Unpin Tab (Зафиксировать вкладку/Отменить фиксацию вкладки) . Зафиксированная вкладка перемещается в левую часть панели вкладок, откуда ее можно быстро открыть.
Перемещение вкладок между пространствами
Рабочие области доступны в верхней части боковой панели и позволяют организовывать вкладки в разные группы. Например, у вас могут быть разные рабочие пространства для покупок, работы или учебы.
Чтобы переместить вкладку в другое пространство, щелкните левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) на вкладку и выберите «Переместить вкладку в пространство», затем выберите нужную рабочую область во всплывающем окне.
Управление вкладками
Если вы хотите, чтобы открытая вкладка отображалась в отдельном окне, просто перетащите вкладку с панели вкладок. Вкладки также можно перетаскивать между открытыми окнами.
Если вы хотите открыть копию страницы в новой вкладке, удерживая Ctrl, нажмите левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) по вкладке и выберите Duplicate Tab (Дублировать вкладку) .
Если вы работаете с большим количеством открытых вкладок, иногда они могут дублироваться. Наведите указатель мыши на одну из вкладок, и браузер Opera выделит повторяющиеся вкладки. Чтобы закрыть все повторяющиеся вкладки, щелкните правой кнопкой мыши одну из вкладок и выберите Закрыть повторяющиеся вкладки.
Все вкладки, открытые в окне, можно сохранить в качестве папки Экспресс-панели. Удерживая Ctrl, нажмите левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) на панели вкладок и выберите Save Tabs as Speed Dial Folder (Сохранить вкладки группой на Экспресс-панели) . Внизу Экспресс-панели появится новая папка без названия.
Открытие закрытых вкладок и просмотр синхронизированных вкладок через меню вкладок
Если вы любите открывать сразу много вкладок, с помощью меню вкладок вам легче будет их упорядочивать, просматривать и открывать нужные.
Меню вкладок находится в правой части панели вкладок. Нажмите меню вкладок, чтобы увидеть список недавно закрытых вкладок и открыть вкладки со всех синхронизируемых устройств.
Взаимодействовать с меню вкладок можно с клавиатуры. Нажмите Ctrl + M, чтобы открыть или закрыть меню вкладок. Для перехода по списку вкладок нажимайте кнопки со стрелками. Нажмите Ввод, чтобы открыть вкладку из списка.
Чтобы пользоваться меню вкладок было еще удобнее, имеет смысл включить предпросмотр вкладок.
Контекстное меню
Контекстное меню появляется, когда вы, удерживая Ctrl, нажимаете левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) на каком-либо элементе веб-страницы. Вид меню зависит от типа элемента (страница, текст, ссылка или картинка).
Контекстное меню страницы появляется, когда вы, удерживая Ctrl, нажимаете левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) в любом месте страницы, где нет никаких ссылок, картинок или текста. В этом меню предлагаются различные варианты навигации (вернуться назад, перейти вперед или перезагрузить страницу), а также варианты сохранения страницы на Экспресс-панели или в закладках, просмотра исходного кода страницы, сохранения страницы в формате PDF и т.д.
Контекстное меню ссылки появляется, когда вы, удерживая Ctrl, нажимаете левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) ссылку, и позволяет выбрать, как открыть или сохранить соответствующую страницу или адрес.
Контекстное меню изображения появляется, когда вы, удерживая Ctrl, нажимаете левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) какую-либо картинку, и предлагает варианты открытия, копирования или сохранения этой картинки.
Если вы, удерживая Ctrl, нажимаете левой кнопкой мыши (Mac) или правой кнопкой мыши (Win/Lin) какое-либо изображение, с которым связана ссылка, в появившемся меню будут присутствовать пункты меню и для изображения, и для ссылки.
Изменение масштаба
Функция изменения масштаба в Opera позволяет упростить чтение мелкого шрифта. Чтобы изменить масштаб в Mac, выберите View (Вид) > Zoom In (Увеличить) / Zoom Out (Уменьшить) . Пользователям Windows или Linux следует перейти в меню O > Zoom (Масштаб). Таким образом вы установите масштаб только для страницы на которой актуально находитесь.
Для увеличения и уменьшения также можно использовать сочетания клавиш Ctrl или ⌘ + + / - .
Чтобы все просматриваемые страницы открывались в нужном масштабе, можно задать масштаб по умолчанию. Чтобы задать масштаб по умолчанию, выполните следующие действия:
- Перейдите в Settings (Настройки) (Preferences (Настройки) на Mac).
- Нажмите Basic (Основные) на боковой панели.
- В разделе Appearance (Оформление) вы найдете Page zoom (Масштаб страницы).
- Выберите, в каком масштабе вам хотелось бы просматривать страницы.
После установки масштаба страницы все открываемые вами страницы будут отображаться в заданном масштабе. Если у вас были открыты какие-либо вкладки, перезагрузите их, чтобы просмотреть страницы в только что заданном масштабе по умолчанию.
Если нужно вернуться к первоначальному формату, пользователям Mac следует нажать View (Вид) > Actual Size (Фактический размер). Пользователям Windows и Linux следует перейти в меню O > Zoom (Масштаб) и выбрать Reset zoom (Сброс масштабирования) справа от +.
Полноэкранный режим
Opera позволяет просматривать страницы в полноэкранном режиме. В полноэкранном режиме панель меню не видна, однако панель вкладок и объединенная адресная строка и строка поиска остаются на экране.
В любом из этих режимов пользователи Mac могут вызвать панель меню на экран, наведя курсор мыши на верхнюю границу экрана.
Для выхода из полноэкраннного режима на любой платформе нажмите Esc.
Поиск текста на странице
Opera может искать ключевые слова в тексте на странице. Чтобы найти слово или фразу на странице, нажмите клавиши Ctrl + F или ⌘ + F на клавиатуре. Введите текст в поле поиска.
В процессе поиска найденные слова выделяются зеленым цветом. Если слово встречается на странице неоднократно, найденные слова выделяются желтым цветом и в поле поиска указывается их количество. Для перехода от одного найденного слова к другому используйте правую или левую стрелку.
Загрузка и управление файлами
При этом справа от объединенной адресной строки и строки поиска появляется новый значок. Нажмите этот значок, чтобы просмотреть перечень недавно загруженных файлов или удалить их из истории загрузок.
Чтобы посмотреть подробный список загруженных файлов, запустить файлы из браузера или заново начать загрузку в случае обрыва соединения, выберите View (Вид) > Downloads (Загрузки) на Mac. В Windows и Linux перейдите в меню O > Downloads (Загрузки) .
Местоположение, где по умолчанию сохраняются загруженные файлы, можно изменить в настройках. Для этого выполните следующие действия:
- Перейдите в Settings (Настройки) (Preferences (Настройки) на Mac).
- Нажмите Browser (Браузер) на боковой панели.
- В разделе Downloads (Загрузки) нажмите кнопку Change… (Изменить…) .
- Выберите папку, в которой должны сохраняться загруженные файлы, и нажмите Select (Выбрать) .
Кроме того, в этом меню можно настроить браузер таким образом, чтобы он всегда спрашивал, куда необходимо сохранить загружаемые файлы.
border: 0; для a img - не работет
Эта рамка отображается только в web-kit браузерах . В firefox её нет.
отображение в chrome
отображение в firefox
Вы неправильно используете тег . Из-за того, что не указан атрибут src, а картинка накладывается background'ом, и появляется эта рамка. Лучше используйте например тег , определив в CSS для него
Ну и не забывайте указывать размеры)
в этом случае сыпется верстка блоков . Тему верстал не я . Я делал отображение изображения,более похожими на кнопку . Можете посоветовать другой выход ?
Тег - это разве не italic для стилизации текста ?
Григорий Сергатый: Тег i устарел для стилизации текста, и его часто переопределяют, чтобы использовать для иконок.
Григорий Сергатый: да, конечно есть другой выход, костыли - это мое призвание) Просто укажите в атрибуте src ссылку на картинку в виде прозрачного пикселя 1x1
а что за repeat:none; ? background-repeat: no-repeat, а лучше background:url(/images/sp_office.jpg) 0 0 no-repeat;
Здесь явно проблема с кроссбраузерностью.
Лучше закачайте эту страницу на хостинг и дайте ответом ссылку. Посмотрю и скажу в чём проблема. Возможно рамка не у самой картинки а у ссылки, в которой находится картинка?
Может рамка не у изображения а у блока поверх? "Офисный переезд" прямо на картинке находится или это отдельный блок?
Григорий Сергатый: спрайты как раз таки с бэкграундом и используются и эффекты ничего не мешает применить, а спрайты с тэгом img - это что-то новенькое
.top_blocks <
width: 817px;
height: 279px;
background: url(/images/blocks_bg.jpg);
float: left;>
/*начало*/
.office <
width: 235px;
height: 277px;
padding-left: 15px;
margin-right: 30px;
>
Это фрагмент кода css отвечающий за отображение блоков на картинке .
Сайт на Wordpress .
Фрагмент кода html для этого блока :
Ваш офис переезжает на новое место и вы хотите избавить себя от всех этих хлопот связанных с этим процессом? Вы обратились по адресу!Подробнее..
Вы переезжаете в другую квартиру, и вы хотите избавить себя от всех хлопот, связанных с этим процессом? Вы обратились по адресу!Подробнее..
— Сброка-разборка, мелкий ремонт мебели;
— Навес картин, жалюзи, карнизов, полок, зеркал, кухонных шкафов и т.д.Подробнее..
Репутация: нет
Всего: нет
Вот так это выглядит.
Причем до 10-й версии оперы. Такой же баг я наблюдал в контролах google web toolkit (или как он там наз-ся). Позже они видимо исправили это (и гугл и опера), но жить с таким неохота все равно.
Может это известная какая-то бага? Я пока ничего не смог найти.
Репутация: 1
Всего: 33
Репутация: 48
Всего: 386
по симптомам похоже на outline
Хотя я тоже не смог это увидеть. Попробуй задать явно, например
outline:0px;
Вожможно подключаются в локальной опере какие-то дополнительные стили?
Репутация: нет
Всего: нет
не, аутлайн не помогает, пробовал.
локально вроде никаких стилей не подключает опера.
Репутация: нет
Всего: 4
Репутация: нет
Всего: нет
Репутация: нет
Всего: 4
Репутация: нет
Всего: нет
да разве ж дело во мне? у меня с десяток разных браузеров разных версий стоит. вы рассуждаете с точки зрения пользователя, а мой интерес лежит в плоскости кроссбраузерной разработки.
Репутация: 48
Всего: 386
engager, в плоскости кроссбраузерной разработки на версии Оперы младше 10-й вообще рекомендуется наплевать То, что они делали до 10 версии - сильно страшнее мелкософта, так как мелкософт хотя бы не плодил версии как пирожки, а зафиксировал список багов и предложил с ними уживаться.
В крайнем случае - поставить ненавязчивую напоминалку о том, что существует автоматическое обновление версии Оперы.
Репутация: нет
Всего: нет
ладно, забью)
будем надеятся на сознательность пользователей.
ибо тот, кто догадался слезть с ИЕ на другой браузер, должен осознавать, что новые версии продукта не просто так выходят.
[ Время генерации скрипта: 0.1167 ] [ Использовано запросов: 20 ] [ GZIP включён ]
Читайте также: