使选择选项font-size与其容器相同，而不指定px / pt单位

Question

这必须是重复的，但我只能找到other questions，其中字体大小已在CSS中明确定义。这里我使用浏览器默认字体大小。

我注意到在Firefox / IE11 / Edge中，列表的option元素中的默认字体大小比包含label中默认使用的字体小。 }或父容器：

Fiddle

毫无疑问，它在HMTL5规范中，这很好。问题是，如果不指定字体大小（例如16px），是否可以使字体大小相同（相对），因为它包含标签（因此没有缩小尺寸）？所以，单词＆＃34;选择＆＃34;和＃34; Foo＆＃34;将是相同的字体大小。

我试过了......

select {font-size:1em;}
select {font-size:100%;}

......没有成功。

Answer 1

你可以试试这个。

label {
 font-size:1em;
}

select{
  font-size:inherit;
 -webkit-appearance: none;
 -moz-appearance: none;
    appearance: none;
 }

这将使它们大小相同而不指定单位。