CSS隐藏打印时选择标记中的下拉箭头

Question

我的HTML代码在这里

<select> 
  <option value="mr"> Mr. </option>
  <option value="mrs"> Mrs. </option>
</select>

当我打印页面时，我不想让下拉恐怖，如何隐藏使用CSS？

Answer 1

select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none; /* If you want to remove the border as well */
background: none;
}

在印刷品上应用上述css

Answer 2

取决于您使用的浏览器......

我还没有找到Firefox的解决方案，但其余的应该用：

select::-ms-expand {
    display: none;
}
.noarrow{

   overflow: hidden;

}

.noarrow select {
  width: 100px;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;    
}