Удаление закругленных углов из элемента <select>в Chrome / Webkit - PullRequest
125 голосов
/ 25 апреля 2011

Таблица стилей пользовательского агента для Chrome дает радиус границы 5 пикселей для всех углов элемента <select>. Я попытался избавиться от этого, применив радиус 0px через мою внешнюю таблицу стилей, а также встроенный в сам элемент; Я пробовал и border-radius:0px, и -webkit-border-radius:0px;, и я попробовал еще более конкретный border-top-left-radius:0px (вместе с эквивалентом -webkit).

Никто не работает.

Когда я проверяю элемент в инструментах разработчика webkit, вычисляемый стиль по-прежнему отображает радиус в 5 пикселей. Но если я щелкну стрелку расширителя рядом с ним, чтобы увидеть подробности, она будет выглядеть следующим образом: element.style - 0px. И ниже это показывает внешнюю спецификацию css, которую я дал 0px, наряду со спецификацией таблицы стилей user-agent 5px. И оба эти последние два перечеркнуты, как и должно быть.

Есть идеи?

Ответы [ 14 ]

0 голосов
/ 25 мая 2016

хорошо, я получил решение.надеюсь, что это может помочь вам:)

select{
      border-image: url(http://www.w3schools.com/cssref/border.png) 30 stretch;
      width: 120px;
      height: 36px;
      color: #999;
  }
<select>
  <option value="1">Hi</option>
  <option value="2">Bye</option>
</select>
0 голосов
/ 19 марта 2015

Почему-то на самом деле это зависит от цвета границы ???При использовании стандартного цвета углы остаются закругленными, но при незначительном изменении цвета округление исчезает.

select.regularcolor {
    border-color: rgb(169, 169, 169);
}

select.offcolor {
    border-color: rgb(170, 170, 170);
}

https://jsfiddle.net/hLg70o70/2/

0 голосов
/ 12 февраля 2013

Firefox: 18

.squaredcorners {
    -moz-appearance: none;
}
0 голосов
/ 25 апреля 2011

Установить CSS как

border-radius:0px !important
-webkit-border-radius:0px !important
border-top-left-radius:0px !important

Попробуйте, если это работает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...