HTML下拉菜单中的文字换行

Question

我想在选项字段中包裹长文本。

示例：

<select class="myselect">
  <option value="">Select</option>
  <option value="1">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>
  <option value="2">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>
  <option value="3">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>

</select>

Answer 1

尝试此代码！希望这对您有用。

.myselect {
  width: 200px;
  max-width: 100%;
}
option {
 white-space: pre-wrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid #DDD;
}

<select class="myselect">
  <option value="">Select</option>
  <option value="1">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>
  <option value="2">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>
  <option value="3">Dummy text Dummy textDummy text Dummy text Dummy textDummy text Dummy text</option>
</select>