如何更改 select 框的下拉面板的樣式，使其具有 chrome 瀏覽器的圓角

Question

嗨，我有一個 angular 5 應用程序。 我有一個 select 框，其中包含一些選項列表。我想為在 chrome 中顯示選項的面板提供圓角。 如何使用 css styles 實現這一目標？

請參閱下面的附件。

Answer 1

您可以使用border-radius 設置來做到這一點。

菲：

#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; 
}