当光标超过 select 和选项时如何将光标设置为指针？

Question

当光标超过 select 和选项时，如何将光标设置为指针？

HTML

<div class="form-group" *ngIf="!isHidden">
    <label><b>Empresa:</b></label>
    <select [(ngModel)]="selectedEmpresa" name="idEmpresa" class="form-control" id="idEmpresa">
         <option *ngFor="let empresa of empresas; index as i" [value]="empresa.id">{{ empresa.nome }}</option>
    </select>
</div>

CSS

#idEmpresa {
  border: 1px solid black;
  border-radius: 4px;
  color: black;
  cursor: pointer;
}

Answer 1

我从 Whosebug 中找到了以下答案，只检查了一次：

遗憾的是，标签是由操作系统而不是浏览器呈现的，因此您无法使用光标来设置它们的样式。相反，使用像 Bootstrap's Dropdown.

这样的插件

MSDN says it best:

Except for background-color and color, style settings applied through the style object for the option element are ignored. In addition, style settings applied directly to individual options override those applied to the containing select element as a whole.

MDN also chimes in

Some elements simply can't be styled using CSS. These include all advanced user interface widgets such as range, color, or date controls as well as all the dropdown widgets, including , ,
and elements. The file picker widget is also known not to be stylable at all. The new and elements also fall in this category.

Answer 2

只有少数样式属性可以应用于元素。这是因为这种类型的元素是“替换元素”的示例。它们是 OS-dependent，不属于 HTML/browser。它不能通过 CSS 设置样式。有替换 plug-ins/libraries 看起来像 a 但实际上由可以设置样式的常规 HTML 元素组成。就像下拉列表 bootstrap

当光标超过 select 和选项时如何将光标设置为指针？

how to set cursor to pointer when its over select and option?

html

css

select

typescript

angular9