问为什么<select>标签的“下拉”部分不受CSS2D转换的影响？

EN

function test() {
    alert("test");
}

let contentDiv = document.getElementById("contentDiv");
let scaleSlider = document.getElementById("scaleSlider");

console.log(contentDiv);
console.log(scaleSlider);

scaleSlider.oninput = function() {
  contentDiv.style = "transform: scale(" + this.value + ")";
};

<div>
  <input type="range" min="0" max="1" value="1" step="0.1"
         class="slider" id="scaleSlider" style="direction: rtl">
  <div id="contentDiv">
    <button onclick="test()">test</button>
    <div style="background:green; width:100px; height:100px"></div>
    <label>some text</label>
    <br />
    <input type="text" name="textInput"></input>
    <br />
    <select>
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </select>
    <br />
    <img src="https://via.placeholder.com/150"></img>
    <ul>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ul>
    <ol>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ol>
    <progress value="22" max="100"></progress>
    <br />
    <svg width="100" height="100">
      <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
    </svg>
    <br />
    <textarea rows="4" cols="50">
      At w3schools.com you will learn how to make a website. We offer free tutorials in all web development technologies. 
    </textarea>
  </div>
</div>