轮播元素外的按钮 [react-multi-carousel]

Posted 2023-02-25

【中文标题】轮播元素外的按钮 [react-multi-carousel]

【英文标题】：Buttons outside of carousel elements [react-multi-carousel]

【发布时间】：2020-12-27 16:46:03

【问题描述】：

是否可以将左右两侧的箭头/按钮设置在轮播项目之外？

图书馆链接：

https://www.npmjs.com/package/react-multi-carousel https://w3js.com/react-multi-carousel

【参考方案1】：

您始终可以将 css 添加到箭头

默认情况下，左箭头有：

left: calc(4% + 1px);

右箭头有：

right: calc(4% + 1px);

如果轮播两侧有空间，则可以更改该 css。

【讨论】：

我尝试添加：` .react-multiple-carousel__arrow right: 0; `

但是，这会被库中实现的默认值覆盖。我怎样才能绕过它？

试试 !important -> ` .react-multiple-carousel__arrow right: 0 !important; `

我正在尝试这种方法，但不知道这是否可行。箭头在react-multi-carousel 内，其中有overflow: hidden;。因此，不会显示箭头

我设法通过为 carousel 中显示的卡片提供适当的边距和填充来实现它。但对我来说，我只需要在carousel 中一次显示一张卡片，所以不确定这是否也可以在这里工作，