css - 如何在反应中正确定位超过 100% 的宽度

Question

我正在使用 react-responsive-carousel 创建一个 youtube 视频轮播，如http://react-responsive-carousel.js.org/storybook/?path=/story/02-advanced--youtube-autoplay-with-自定义拇指。

如图所示，我想移除两侧的黑匣子。

我用过<ReactPlayer width="100%" url={url} playing={isSelected} height="100%" /> 。

当我尝试时，width=120%我在某种程度上得到了我想要的结果。

有什么办法可以让视频居中，这样就可以覆盖整个区域，两边都没有黑色空间。

Answer 1

您可以使用样式使播放器居中。

<ReactPlayer style={{margin:"auto",text-align:"center",width="100%"}} url={url} playing={isSelected} height="100%" />