怎样设<video>清晰度按点击后弹出的钮弹框垂直高度100rpx

要设定<video>清晰度按点击后弹出的按钮弹框垂直高度为100rpx，可以使用CSS样式表来完成。具体的实现方法如下：

1. 首先，需要为视频添加一个播放控件，可以使用HTML5 <video> 标签来完成，如下所示：

<video controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.webm" type="video/webm">
  Your browser does not support the video tag.
</video>

2. 接下来，需要使用CSS样式表来定义弹出的按钮弹框的样式，如下所示：

.video-quality {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100px;
  background-color: #fff;
  border: 1px solid #ccc;
  z-index: 999;
}

在上面的样式中，我们使用了 `position: absolute;` 来将弹框定位到页面的绝对位置，使用 `top: 100%;` 将弹框向下偏移100%的高度（即与播放控件底部重合），使用 `left: 0;` 将弹框定位到左侧，使用 `width: 100%;` 将弹框的宽度设置为与播放控件相同，使用 `height: 100px;` 将弹框的高度设置为100px，使用 `background-color` 和 `border` 属性来定义弹框的背景色和边框样式，使用 `z-index: 999;` 将弹框的层级设置为最高。

3. 最后，需要通过JavaScript来控制弹框的显示和隐藏，如下所示：

var video = document.querySelector('video');
var qualityBtn = document.querySelector('.quality-btn');
var qualityBox = document.querySelector('.video-quality');

qualityBtn.addEventListener('click', function() {
  qualityBox.style.display = 'block';
});

video.addEventListener('click', function() {
  qualityBox.style.display = 'none';
});

在上面的代码中，我们首先使用 `document.querySelector` 方法获取到视频和弹框的元素，然后使用 `addEventListener` 方法为弹框按钮和视频添加点击事件，当点击弹框按钮时，将弹框的 `display` 属性设置为 `block`，使其显示在页面上；当点击视频时，将弹框的 `display` 属性设置为 `none`，使其隐藏起来。