您可以使用Javascript来实现这一点。试试下面的代码:

HTML

<select id="myDropdown">      
    <option>Option 1</option>     
    <option>Option 2</option>     
    <option>Option 3</option>     
</select> 

JS

document.getElementById("myDropdown").selectedIndex = -1;

或JQuery

$("#myDropdown").prop("selectedIndex", -1);

如果你使用的是Angular(2+)，(或任何其他框架)，你可以添加一些逻辑。逻辑是:如果用户还没有选择任何其他选项，则只显示一个空选项。 因此，在用户选择了一个选项之后，空选项就会消失。

对于Angular(9)，它看起来像这样:

<select>
    <option *ngIf="(hasOptionSelected$ | async) === false"></option>
    <option *ngFor="let option of (options$ | async)[value]="option.id">{{ option.title }}</option>
</select>

我使用Laravel 5框架和@Gambi的答案也适用于我，但对我的项目做了一些更改。

我在一个数据库表中有选项值，我用foreach语句使用它们。但在声明之前，我已经添加了一个选项与@Gambit建议设置，它工作。

以下是我的例子:

@isset($keys)
  <select>
    <option  disabled selected value></option>
    @foreach($keys as $key)
      <option>{{$key->value)</option>
    @endforeach
  </select>
@endisset 

我希望这也能帮助到某些人。再接再厉!

只使用CSS的解决方案:

答:内联CSS

<选择> <选择风格= "显示:没有;" > < /选项> <选项>选项1 > < /选项 <选项>选项2 > < /选项 <选项>选项3 > < /选项 < /选择>

B: CSS样式表

如果你有一个CSS文件在手，你可以针对第一个选项使用:

选择。first-opt隐藏选项:first-of-type { 显示:没有; ｝ <选择类= " first-opt-hidden " > <选项> < /选项> <选项>选项1 > < /选项 <选项>选项2 > < /选项 <选项>选项3 > < /选项 < /选择>

只要用“..”选项隐藏选择..”作为默认选项

这应该会有帮助:

https://www.w3schools.com/tags/att_select_required.asp

< >形式 需要<选择> <选项值= " " > < /选项>没有 沃尔沃<选项值=“沃尔沃”> < /选项> 萨博<选项值= "萨博" > < /选项> <选项值= "奔驰" >奔驰> < /选项 <选项值=“奥迪”>奥迪> < /选项 < /选择> <按钮类型=“提交”> > < /按钮提交 > < /形式