如何自定义 React Recaptcha 的样式？

问题描述

我在 React 应用程序中使用 this 包。

问题是在特定设备 galaxy Fold 中运行应用程序时，选择图像的容器太大。

我需要使用此 ID rc-imageselect 更改 div 的大小。

这是我的代码

        <div className={classes.recapt} style={{ transform: 'scale(0.8,0.8) translateX(10%)',display: "table" }}>
          <Recaptcha
            expiredCallback={() => setCaptchaCode(false)}
            sitekey={localStorage.getItem("CAPTCHA_KEY")}
            render="explicit"
            onloadCallback={callback}
            verifyCallback={verifyCallback}
          />
        </div>

   export default makeStyles((theme) => ({
    recapt: {
      "&div": {
        "&#rc-imageselect": {
            transform: 'scale(0.8,0.8) translateX(10%)'
        }
       }
    }
   }));

但这不起作用。

我在 te 检查面板中更改了它并且它有效。所以我想我以错误的方式选择了 div。

任何帮助将不胜感激。

解决方法

我认为你的风格定位有问题，试试这个：

"& > div > image"

我认为你不能使用查询（#elementID）。

编辑

上传照片后：看看this