我如何更改 select 框的下拉面板的样式，使 chrome 浏览器具有圆角

Question

您好，我有一个 angular 5，应用程序。我有一个 select 框，其中包含一些选项列表。我想为在 chrome 中显示选项的面板提供圆角。如何使用 css 样式实现此目的？

请看下面的附件。

Answer 1

您可以使用 border-radius 设置来做到这一点。

F.i.:

#rcorners1 {
  border-radius: 25px;
  background: #73AD21;
  padding: 20px; 
  width: 200px;
  height: 150px; 
}

#rcorners2 {
  border-radius: 25px;
  border: 2px solid #73AD21;
  padding: 20px; 
  width: 200px;
  height: 150px; 
}

#rcorners3 {
  border-radius: 25px;
  background: url(paper.gif);
  background-position: left top;
  background-repeat: repeat;
  padding: 20px; 
  width: 200px;
  height: 150px; 
}

我如何更改 select 框的下拉面板的样式，使 chrome 浏览器具有圆角

How can i change the style of the drop down panel of a select box to have round corners for chrome browser

html

css

webkit

google-chrome-extension