video标签自定义样式

可以使用CSS来自定义video标签的样式，例如：

/* 自定义video标签的样式 */
video {
  width: 100%;
  height: auto;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

/* 自定义video控制条的样式 */
video::-webkit-media-controls {
  display: none !important;
}

video::-webkit-media-controls-enclosure {
  width: 100%;
  height: 50px;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5px;
}

video::-webkit-media-controls-play-button {
  display: none;
}

video::-webkit-media-controls-timeline {
  height: 5px;
}

video::-webkit-media-controls-current-time-display,
video::-webkit-media-controls-time-remaining-display {
  color: #fff;
  font-size: 12px;
  margin: 0 5px;
}

video::-webkit-media-controls-volume-slider-container,
video::-webkit-media-controls-mute-button {
  display: none;
}

这个CSS代码片段会将video标签的宽度设置为100%，高度自适应，并添加圆角和阴影效果。同时，它会隐藏掉浏览器默认的控制条，并添加自定义的控制条样式。你可以根据需要修改其中的样式属性来自定义自己的video标签样式。