css - 下拉列表中的破折号键入文本样式

Question

我正在使用 dcc.dropdown为 Dash我和我的应用程序改变了样式。我还设法更改了下拉选项中文本的背景和颜色。但是，我似乎无法更改可以在下拉菜单中键入的文本样式(这也是一种非常有用的输入新值的方法)。关于我如何管理这个的任何想法？

破折号 HTML:

html.Div(
  [html.H1(children='2.',className="drop-zone-h1"),
     dcc.Dropdown(id='category-col-selection-dropdown',
                  options=[],
                  placeholder="Select category column",
                  className="drop-zone-dropdown"
     )
  ],className="drop-zone-columns"
),

CSS:

.drop-zone-columns {
    display: grid;
    grid-template-columns: 2rem 1fr;
    align-items: center;
    margin: 1rem;
}

.drop-zone-dropdown {
    color: #fff;
    margin: 1rem;
    font-size: 1.428571rem !important;
    font-family: SourceSansProSemiBold;
    /*width:380px*/
}

Answer 1

一种方法是在 Div 的样式中使用“字体大小”

html.Div([dcc.Dropdown(id="component_id",
                       options=[{'label': val, 'value': val} for val in mylist],
                                value=value,
                                style ={'backgroundColor': "#ffffff",
                                        'width':'20vH','height':'40px'})
                        ],className = '...',
                        style={'height':height,
                               'margin-top':   '0px',
                               'margin-left':  '10px',
                               'font-size': '12px'})