Select css как убрать рамку

Рамка у Select’a

В общем столкнулся с проблемой образования нормального стиля рамки у тега select. Обычными солидами не обойтись — пробовал создавать рамку у div’a и в него вставлял select со скрытой рамкой — ничего вразумительного не получилось. Если возможно, выложите код с описание как это можно сделать.

13 ответов

10 марта 2006 года
3.5K / / 15.06.2005

Originally posted by Lohotron
В общем столкнулся с проблемой образования нормального стиля рамки у тега select. Обычными солидами не обойтись — пробовал создавать рамку у div’a и в него вставлял select со скрытой рамкой — ничего вразумительного не получилось. Если возможно, выложите код с описание как это можно сделать.

А покажи, как ты div’ом делал. Просто другого способа нет. Разве что написать свой select’о-подобный select.

11 марта 2006 года
3.0K / / 13.12.2005

База данных

13 марта 2006 года
6 / / 10.03.2006

Originally posted by mfender
А покажи, как ты div’ом делал. Просто другого способа нет. Разве что написать свой select’о-подобный select.

К сожалению давненько это было, уже не помню точно,какими средствами пользовался, по этому и попросил пример кода 🙁

13 марта 2006 года
6 / / 10.03.2006
Originally posted by alekciy
«Матчасть учим!» (с)
Оно?

нед, нужно изменить рамку а недобавить поверх существующей еще одну.

13 марта 2006 года
3.0K / / 13.12.2005
Originally posted by Lohotron
нед, нужно изменить рамку а недобавить поверх существующей еще одну.

Что бы рамка изменялась при наведении курсора на SELECT? Так это JS тогда, а не CSS тебе нужен. А в CSS все останется так, как я и написал.

13 марта 2006 года
3.5K / / 15.06.2005
Originally posted by Lohotron
нед, нужно изменить рамку а недобавить поверх существующей еще одну.

Такое чудо — только в Опере. Остальные браузеры исползуют виндовый комбо-бокс, который прорисовывается совсем иначе, чем прочие элементы ввода. Обращал внимание когда-нибудь, что все select’ы выползают выше flash-роликов?

13 марта 2006 года
6 / / 10.03.2006

Originally posted by mfender
Такое чудо — только в Опере. Остальные браузеры исползуют виндовый комбо-бокс, который прорисовывается совсем иначе, чем прочие элементы ввода. Обращал внимание когда-нибудь, что все select’ы выползают выше flash-роликов?

Я точно помню, что средствами css можно эту рамку вообще убрать (а потом налепить рамку с помошью того же div-а или span-а), вот только как это сделать по умному?:/

Есть извратный способ, который мне посоветовали — но он никуда не годиться:

13 марта 2006 года
6 / / 10.03.2006
Еще вот так пробовал:

работает в ИЕ, но не хочет убирать рамку select-а в мозиле.
13 марта 2006 года
4 / / 03.03.2006
в мозиллах, так же как и в новой опере, outer > select убирает рамку.
13 марта 2006 года
3.0K / / 13.12.2005

Originally posted by Lohotron
Я точно помню, что средствами css можно эту рамку вообще убрать (а потом налепить рамку с помошью того же div-а или span-а), вот только как это сделать по умному?:/

Матчасть все же учим. Средствами CSS это сделать нельзя. Способы связанные с фичами/глюками разных браузеров я за способ решения сабжа не беру. Изврат это. Так же как и делать усечение. Потому как это не убирание рамки, а её обрезка (скрытие).

13 марта 2006 года
6 / / 10.03.2006
Originally posted by -no-
в мозиллах, так же как и в новой опере, outer > select убирает рамку.

К сожалению не помогло, по крайней мере в пятой версии мозилы.

21 декабря 2010 года
4 / / 31.07.2010
Поищи программу, которой выполняется изменить рамку. Например, скачай отсюда.
07 января 2011 года
33 / / 25.01.2004

Советую использовать таблицу.
В ячейках таблицы удобно располагать элементы формы.
[HTML]

База данных

[/HTML]
Поэкспериментируйте с параметрами таблицы.

CellSpacing — расстояние между ячейками.
CellPadding — «поля» ячейки, т.е. расстояние между краями ячейки и содержимым.

Вместо слова Solid (сплошная рамка) можно использовать
None, Dotted, Dashed, Double, Groove, Ridge, Inset, Outset.

Вместо Red можно указать любой другой цвет.

Вместо 4px можно указать любой другую толщину.

Тег означает начало новой строки таблицы.
Тег означает начало новой ячейки в той же строке.

Как убрать границу select и изменить цвет?

Пробую разобраться в css. Задание: разместить блоки в строку и при этом у второго блока select поменять цвет и убрать границу.
Блоки разместила, но при этом цвет и границы у второго блока убрать не могу, даже при командах: border: none; или outline: none;

   Новостное агентство    Самые свежие новости в реальном времени 13.05.2020 20:04
 
 
      
 +22C
 TEKCT

html, body < margin: 0; padding: 0; min-width: 1000px; >#black-bar < background-color: black; color: white; padding: 20px; >#black-bar a < color: white; >#daytime < float: right; >.fixed-container < width: 960px; margin: 0 auto; >.ui < display: inline-block; margin-top: 40px; >.ilo < float:right; background-color: yellow; width: 100px; >.ilo2 < float: left; background-color: yellow; width: 100px; >.ilo3 < margin-left: 62px; margin-top: 50px; color: red; border: none; >.ilo4

1 ответов

Привет, все блоки в строку, второй селект другого цвета и без границы. Если я правильно понял задание, то тогда вот так. HTML

   Новостное агентство    Самые свежие новости в реальном времени 13.05.2020 20:04
 
 
      
  +22C
 TEKCT

html, body < margin: 0; padding: 0; min-width: 1000px; >div < display: inline-block; border: solid 1px; >.ilop < /* padding: 10px; background: red; */ border: 0px; >div.ilop > select

Интерактивные уроки и курсы программирования и создания сайтов (дистанционное обучение) помогут вам в игровой форме изучить основы языков программирования веб-разработки и веб-программирования с нуля. Обучение онлайн 24/7.

Общие ссылки

Отзывы
Политика конфидециальности
Условия использования
Блог
Цена и оплата
Курсы и скринкасты
Сертификаты
Партнерская программа
Комьюнити

Наши курсы и скринкасты

HTML/CSS Advanced
Bootstrap 4
Vue JS
Linux, GIT and web-hosting
HTML and CSS
Modern Javascript
Javascript/jQuery
Codeigniter
Все курсы и скринкасты

border у тега select либо option

Подскажите уважаемые специалисты, как убрать при hover,focus рамку которая появляется , прошу заметить что варианты как:

select:focus, select:hover, option:hover, option:focus

не работает в большинстве броузеров ! Прошу помочь
Отслеживать
задан 25 фев 2016 в 13:18
user33274 user33274
вендорные префиксы должны помочь
25 фев 2016 в 13:22
например ! покажите код
25 фев 2016 в 13:24
Вот пример: -moz-border:none; // для фаерфокса -webkit-border:none; // для хрома
25 фев 2016 в 17:18

вы реально проверили это ? у меня не работает во сех браузерах — и с webkit на chome на ретина safari на linux не работает во всех броузерах , в виндоус на всех на ANDROID вообще ни в дном

26 фев 2016 в 23:35

На сколько я знаю редактировать все элементы формы напрямую нельзя. Обычно их используют скрытыми, а отрисовывают нужный дизайн стандартной версткой, после чего скриптами помечают нужные параметры input’ов и отправляют формой.

Кастомизация select: как убрать все рамки и фон?

В стандартном варианте все устраивает, кроме наличия рамки (первый рисунок). При попытке убрать рамку через css border: none; она исчезает, но появляется оформление кнопки. Можно ли как-то кастомизировать, чтобы остались только текст и кнопка «стрелка»?

Вопрос задан более трёх лет назад
21668 просмотров